powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / [JS] Событие img onload
10 сообщений из 10, страница 1 из 1
[JS] Событие img onload
    #38626312
Goror
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Есть значит js скриптик, который выводит фотки в цикле, если интернет тормозит, то фотки как шпалеры разворачиваются, не очень красиво, хотел сделать, что-то типа прелойдера для фоток, но что-то не очень выходит, пробовал вот так:


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




Как можно это попроще реализовать?
...
Рейтинг: 0 / 0
[JS] Событие img onload
    #38626396
ILLHEAD
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Код: 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
[JS] Событие img onload
    #38626397
ILLHEAD
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
upd:
Код: javascript
1.
2.
3.
function letHeavySrc() {
	document.img01.src = heavyImage.src;
}
...
Рейтинг: 0 / 0
[JS] Событие img onload
    #38626678
Goror
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
ILLHEAD,

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

Твой пример рабочий, но в моём случае, кажется он не работает.. У меня JS скриптом генерируются теги <img> и их не видно в DOM.., ну или что-то подобное, в общем выводит ошибку: document.img01 is undefined. Хотя по сути картинка с таким name присутствует.покажите ваш скрипт
...
Рейтинг: 0 / 0
[JS] Событие img onload
    #38626686
Goror
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
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
[JS] Событие img onload
    #38626717
ILLHEAD
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
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
[JS] Событие img onload
    #38626776
Goror
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
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
[JS] Событие img onload
    #38626861
Goror
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
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
[JS] Событие img onload
    #38626891
ILLHEAD
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
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
10 сообщений из 10, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / [JS] Событие img onload
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


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