У меня есть сайт фотогалереи.Есть 17 больших изображений, которые я хочу предварительно загрузить, прежде чем позволить пользователю нажать на любой из эскизов.Идея состоит в том, что, когда окончательное изображение загружено, я могу отобразить страницу и убедиться, что, когда пользователь нажимает на миниатюру, появляется большое изображение для показа (и при этом не загружается).Я не знаю URL-адреса изображений, пока не получу данные в формате JSON-P из вызова $ .getScript ().
Итак, у меня есть этот код в http://www.stephentang.net/j/photoModule.js
$.each(self.jsonObj.imageItems, function(index) {
$("<img />").attr("src", STP.HOSTNAME + self.jsonObj.imageItems[index].imgSrc).load(function() {
num_left_to_load = num_left_to_load - 1;
console.log('Left to Load: ' + num_left_to_load);
if (num_left_to_load <= 0) {
if (typeof callback === "function") {
console.log('callback is triggered');
$("#loading-div").remove();
self.jqFilmstrip.css('display', 'block');
self.jqFeaturedPhotoImg.css('display', 'block');
callback.apply(context);
}
}
});
});
Я поставил несколько операторов console.log ().В FF3.5 + и Safari значение num_left_to_load достигает 0, что вызывает функцию обратного вызова.В IE8 (и, возможно, IE7) num_left_to_load никогда не достигает 0. В результате страница застряла в сообщении «Загрузка ...».
Я не ищу решение для плагинов.
Спасибо, что прочитали.
РЕДАКТИРОВАТЬ: Я удалил сообщение "Загрузка ..." и больше не скрываю страницу.Похоже, что в IE8 после первой загрузки изображения кэшируются, поэтому метод load (), похоже, не работает, в результате чего счетчик не достигает 0.
РЕДАКТИРОВАТЬ: я попытался window.ready (), но окно загружается очень быстро.
РЕДАКТИРОВАТЬ: При первой загрузке появляются кеш-образы IE6-8, а затем проверяют кеш перед выполнением исходящих запросов, поэтому .load () не работает с ними последовательно.