Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / [JS] Событие img onload / 10 сообщений из 10, страница 1 из 1
25.04.2014, 21:59
    #38626312
Goror
Goror
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
[JS] Событие img onload
Есть значит js скриптик, который выводит фотки в цикле, если интернет тормозит, то фотки как шпалеры разворачиваются, не очень красиво, хотел сделать, что-то типа прелойдера для фоток, но что-то не очень выходит, пробовал вот так:


Код: html
1.
<img src="loader.gif" onload="(this.src='+img_url+')">




Как можно это попроще реализовать?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.04.2014, 06:57
    #38626396
ILLHEAD
ILLHEAD
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
[JS] Событие img onload
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
<html>

<head>
<script language = "JavaScript">
function preloader() {
	heavyImage = new Image(); // объект для прелоада тяжелого имэджа
	heavyImage.src = "https://img.imgsmail.ru/p/0.13.3/i/mail/logo/logo.png";
	heavyImage.onLoad = letHeavySrc();
}
function letHeavySrc() {
	document.img01.src="https://img.imgsmail.ru/p/0.13.3/i/mail/logo/logo.png";
}
</script>
</head>

<body onLoad="javascript:preloader()">
<img name="img01" src="https://www.caritas.us/sites/default/files/images/misc/loading.gif">
</body>

</html>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.04.2014, 07:08
    #38626397
ILLHEAD
ILLHEAD
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
[JS] Событие img onload
upd:
Код: javascript
1.
2.
3.
function letHeavySrc() {
	document.img01.src = heavyImage.src;
}
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.04.2014, 19:50
    #38626678
Goror
Goror
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
[JS] Событие img onload
ILLHEAD,

Твой пример рабочий, но в моём случае, кажется он не работает.. У меня JS скриптом генерируются теги <img> и их не видно в DOM.., ну или что-то подобное, в общем выводит ошибку: document.img01 is undefined. Хотя по сути картинка с таким name присутствует.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.04.2014, 19:51
    #38626679
ILLHEAD
ILLHEAD
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
[JS] Событие img onload
GororILLHEAD,

Твой пример рабочий, но в моём случае, кажется он не работает.. У меня JS скриптом генерируются теги <img> и их не видно в DOM.., ну или что-то подобное, в общем выводит ошибку: document.img01 is undefined. Хотя по сути картинка с таким name присутствует.покажите ваш скрипт
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.04.2014, 20:11
    #38626686
Goror
Goror
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
[JS] Событие img onload
ILLHEADGororILLHEAD,

Твой пример рабочий, но в моём случае, кажется он не работает.. У меня JS скриптом генерируются теги <img> и их не видно в DOM.., ну или что-то подобное, в общем выводит ошибку: document.img01 is undefined. Хотя по сути картинка с таким name присутствует.покажите ваш скрипт

Код: javascript
1.
2.
3.
4.
5.
6.
7.
for (i = 0; i < elements.length; i++){
	id = elements[i].id;
        img_url = elements[i].img;
	.....									
	content += '<img name="img'+id+'" src="'+img_url+'">';
        .....
}



Это фрагмент кода, где генерируются картинки, img01 я поменял на img1 и тд.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.04.2014, 21:33
    #38626717
ILLHEAD
ILLHEAD
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
[JS] Событие img onload
GororILLHEADпропущено...
покажите ваш скрипт

Код: javascript
1.
2.
3.
4.
5.
6.
7.
for (i = 0; i < elements.length; i++){
	id = elements[i].id;
        img_url = elements[i].img;
	.....									
	content += '<img name="img'+id+'" src="'+img_url+'">';
        .....
}



Это фрагмент кода, где генерируются картинки, img01 я поменял на img1 и тд.чесно говоря непонятно. можете сделать проблемную страничку и дать ее урл тут?

можно массив для прелоуд сделать. и по говности каждого элемента массива отдавать его реальным img в src
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.04.2014, 22:30
    #38626776
Goror
Goror
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
[JS] Событие img onload
ILLHEADGororпропущено...


Код: javascript
1.
2.
3.
4.
5.
6.
7.
for (i = 0; i < elements.length; i++){
	id = elements[i].id;
        img_url = elements[i].img;
	.....									
	content += '<img name="img'+id+'" src="'+img_url+'">';
        .....
}



Это фрагмент кода, где генерируются картинки, img01 я поменял на img1 и тд.чесно говоря непонятно. можете сделать проблемную страничку и дать ее урл тут?

можно массив для прелоуд сделать. и по говности каждого элемента массива отдавать его реальным img в src

Могу конечно, просто это долгая история будет, как я вижу с этими прелойдерами, я рассчитывал по проще это реализовать, но раз такое дело, наверно пока проще отложить, это дело! Не хочу вас тоже беспокоить!
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.04.2014, 01:23
    #38626861
Goror
Goror
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
[JS] Событие img onload
ILLHEAD,

Всё норм, немного переделал ваш код и всё заработало)

Код: javascript
1.
2.
3.
4.
5.
function preloader(id,url) {
		img_id = new Image();
		img_id.src = url;
		img_id.onload = function() {document.getElementById(id).src = url; }
}




Спасибо!
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.04.2014, 07:49
    #38626891
ILLHEAD
ILLHEAD
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
[JS] Событие img onload
GororILLHEAD,

Всё норм, немного переделал ваш код и всё заработало)

Код: javascript
1.
2.
3.
4.
5.
function preloader(id,url) {
		img_id = new Image();
		img_id.src = url;
		img_id.onload = function() {document.getElementById(id).src = url; }
}




Спасибо!заюзал ваш вариант. Спасибо
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
<html>

<head>
<script language = "JavaScript">
function preloader2(id,url) {
		img_id = new Image();
		img_id.src = url;
		img_id.onload = function() {document.getElementById(id).src = url; }
}
</script>
</head>

<body>
<img id="img01" src="http://aurora24.ru/images/loading-big.gif" onload="preloader2(this.id,'http://www.php.net/images/logo.php')">
</body>

</html>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / [JS] Событие img onload / 10 сообщений из 10, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 378ms
Закрыть
start [/forum/topic.php?fid=22&tablet=1&tid=1447152]:
 0ms
get settings:
 9ms
get forum list:
 14ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 60ms
get topic data:
 11ms
get forum data:
 3ms
get page messages:
 41ms
get tp. blocked users:
 1ms
others: 231ms
total:  378ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]