Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 18.10.2012, 07:41
Профессор
Отправить личное сообщение для Почемучкин Посмотреть профиль Найти все сообщения от Почемучкин
 
Регистрация: 11.05.2011
Сообщений: 241

Как отличить какие изображения уже загрузились, а какие еще нет?
Как отличить какие изображения уже загрузились, а какие ещё нет?

Внимание: я не могу заранее повесить свою функцию на onload. Скрипт начинает работать с задержкой, когда дерево DOM уже загружено и вебстраница находится в состояниях "еще грузится" или "уже все загружено".
Вот тут и надо понять какие изображения еще не загрузились или загрузились не до конца.
Ответить с цитированием
  #2 (permalink)  
Старый 18.10.2012, 08:18
Аватар для Kos
Kos Kos вне форума
Аспирант
Отправить личное сообщение для Kos Посмотреть профиль Найти все сообщения от Kos
 
Регистрация: 01.09.2008
Сообщений: 79

Вот jquery-плагин http://desandro.github.com/imagesloaded/, который позволяет ставить обработчик на момент загрузки всех изображений, если же тебе нужно по отдельности - присваивай изображениям идентификаторы, и в load-обработчике для каждого изображения отмечай какое загрузилось, лучше в массиве, так ты в любой момент времени сможешь понять какие уже загружены, какие еще нет
Ответить с цитированием
  #3 (permalink)  
Старый 18.10.2012, 08:49
Профессор
Отправить личное сообщение для Почемучкин Посмотреть профиль Найти все сообщения от Почемучкин
 
Регистрация: 11.05.2011
Сообщений: 241

Я ж сказал, что не могу повесить onload заранее
Нашел тут инфу, что есть такой флажок, как img.complete
Скажите - оно во всех браузерах работает или нет, а может особенности какие-то у .complete есть?

Последний раз редактировалось Почемучкин, 18.10.2012 в 08:58.
Ответить с цитированием
  #4 (permalink)  
Старый 18.10.2012, 18:23
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от Почемучкин
Скажите - оно во всех браузерах работает или нет, а может особенности какие-то у .complete есть?
в доках всё есть :
http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-17701901 - старая дока. HTML4
https://developer.mozilla.org/en-US/...MLImageElement - новая дока HTML5 раз
http://www.whatwg.org/specs/web-apps...mlimageelement - новая дока HTML5 два
http://www.w3.org/TR/html-markup/img.html - новая дока HTML5 три

СПОЙЛЕР : (можно посмотреть ссыль на MDN и успокоиться - это свойство появилось в HTML5, а это значит, что старообрядцы (угадайте, кто) не имеют этого свойства)

но мы знаем, что IE имеет свой монастырь

http://msdn.microsoft.com/en-us/libr...=vs.85%29.aspx

как вы думаете, можно ли получить, к примеру, размер изображения (скольок занимает на диске), если оно ещё не загружено ?

Последний раз редактировалось melky, 18.10.2012 в 18:58.
Ответить с цитированием
  #5 (permalink)  
Старый 18.10.2012, 18:32
Аватар для Nekromancer
Профессор
Отправить личное сообщение для Nekromancer Посмотреть профиль Найти все сообщения от Nekromancer
 
Регистрация: 06.05.2009
Сообщений: 1,163

melky,
IE имеет. Множество в HTML5 взято из IE. В частности потому, что Microsoft это предложил и потому, что бы было легче делать полифилы.
__________________
Нужно равняться на лучших, а не оправдываться за счёт худших.
Ответить с цитированием
  #6 (permalink)  
Старый 18.10.2012, 18:34
Аватар для Nekromancer
Профессор
Отправить личное сообщение для Nekromancer Посмотреть профиль Найти все сообщения от Nekromancer
 
Регистрация: 06.05.2009
Сообщений: 1,163

Цитата:
True if the browser has fetched the image, and it is in a supported image type that was decoded without errors.
Соответственно если будет ошибка, то complete никогда не придёт.
__________________
Нужно равняться на лучших, а не оправдываться за счёт худших.
Ответить с цитированием
  #7 (permalink)  
Старый 18.10.2012, 18:56
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от Nekromancer Посмотреть сообщение
melky,
IE имеет. Множество в HTML5 взято из IE. В частности потому, что Microsoft это предложил и потому, что бы было легче делать полифилы.
хм ... но не до такой же степени

я нашёл костыль ... ну, "помощь в определении загрузки картинки".

обновил предыдущий пост.

Сообщение от Nekromancer Посмотреть сообщение
Соответственно если будет ошибка, то complete никогда не придёт.
я вижу решение проблемы так :
if (myImg.complete === false) {
     // у картинки есть это свойство, и она почему-то не загружена
    // загружаем заново, и вешаем обработчики на error и load 
}
Ответить с цитированием
  #8 (permalink)  
Старый 18.10.2012, 19:27
Аватар для Nekromancer
Профессор
Отправить личное сообщение для Nekromancer Посмотреть профиль Найти все сообщения от Nekromancer
 
Регистрация: 06.05.2009
Сообщений: 1,163

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<script>

function log(arg) {
var div = document.createElement('div');
div.innerHTML = arg;
document.body.appendChild(div);
}
			(function() {
				var img = new Image();
				img.onload = function() {
					setTimeout(function() {
						log(img.complete + ' load 1 ' + img.getAttribute('complete'));
					}, 1);
				};
				img.src = 'http://javascript.ru/files/onready/img5.php';
				document.body.appendChild(img);
				log(img.complete + ' not load 1 ' + img.getAttribute('complete'));
			}());
			
			(function() {
				var img = new Image();
				img.onload = function() {
					setTimeout(function() {
						log(img.complete + ' load  2' + img.getAttribute('complete'));
					}, 1);
				};
				img.onerror = function() {
					setTimeout(function() {
						log(img.complete + ' error 2 ' + img.getAttribute('complete'));
					}, 1);
				};
				img.src = 'about:blank';
				document.body.appendChild(img);
				log(img.complete + ' not load 2 ' + img.getAttribute('complete'));
			}());
		</script>
	</body>
</html>


Говорю же, что работает в ИЕ, проверь
__________________
Нужно равняться на лучших, а не оправдываться за счёт худших.

Последний раз редактировалось Nekromancer, 18.10.2012 в 21:26. Причина: Сделал лог в тело документа
Ответить с цитированием
  #9 (permalink)  
Старый 18.10.2012, 19:30
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от Nekromancer
Говорю же, что работает в ИЕ, проверь
заменить бы console.log на alert - я открыл в IE 8 , и ничего не увидел.
Ответить с цитированием
  #10 (permalink)  
Старый 18.10.2012, 19:31
Аватар для Nekromancer
Профессор
Отправить личное сообщение для Nekromancer Посмотреть профиль Найти все сообщения от Nekromancer
 
Регистрация: 06.05.2009
Сообщений: 1,163

melky,
Там и средства разработки есть, F12 -> Сценарии
__________________
Нужно равняться на лучших, а не оправдываться за счёт худших.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
глюк форума Gvozd Сайт Javascript.ru 11 18.03.2009 14:37