Как отличить какие изображения уже загрузились, а какие еще нет?
Как отличить какие изображения уже загрузились, а какие ещё нет?
Внимание: я не могу заранее повесить свою функцию на onload. Скрипт начинает работать с задержкой, когда дерево DOM уже загружено и вебстраница находится в состояниях "еще грузится" или "уже все загружено". Вот тут и надо понять какие изображения еще не загрузились или загрузились не до конца. |
Вот jquery-плагин http://desandro.github.com/imagesloaded/, который позволяет ставить обработчик на момент загрузки всех изображений, если же тебе нужно по отдельности - присваивай изображениям идентификаторы, и в load-обработчике для каждого изображения отмечай какое загрузилось, лучше в массиве, так ты в любой момент времени сможешь понять какие уже загружены, какие еще нет
|
Я ж сказал, что не могу повесить onload заранее :)
Нашел тут инфу, что есть такой флажок, как img.complete Скажите - оно во всех браузерах работает или нет, а может особенности какие-то у .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,
IE имеет. Множество в HTML5 взято из IE. В частности потому, что Microsoft это предложил и потому, что бы было легче делать полифилы. |
Цитата:
|
Цитата:
я нашёл костыль ... ну, "помощь в определении загрузки картинки". обновил предыдущий пост. Цитата:
if (myImg.complete === false) {
// у картинки есть это свойство, и она почему-то не загружена
// загружаем заново, и вешаем обработчики на error и load
}
|
<!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>
Говорю же, что работает в ИЕ, проверь :) |
Цитата:
|
melky,
Там и средства разработки есть, F12 -> Сценарии |
| Часовой пояс GMT +3, время: 22:35. |