Предварительная загрузка изображений для содержимого AJAX с помощью вкладок jQueryUI

Question

Итак, у меня есть довольно симпатичное приложение, использующее ui-tabs ... проблема в том, что я не могу до сих пор найти способ предварительно загрузить изображения в моем содержимом ajax до того, как отобразится панель вкладок. Единственный способ, о котором я могу подумать, - это создать свою собственную функциональность ajax для загрузки содержимого панели вкладок и добавить что-то подобное в вызов ajax:

success: function(response){
    $(response).find('img').preload({
            onFinish: function(){
                    currentTabPanel.show();
            }
    });

}

Но я думаю, что ДОЛЖЕН быть лучший способ сделать это, используя встроенные методы и события AJAX в объекте jQueryUi.tabs () ... Я просто не думаю, что вижу это ... . arg .. есть идеи ??

Answer 1

Это грязный маленький скрипт, который я иногда использую, но он прекрасно работает:

var imgstopreload = new Array('file1.jpg', 'file2.jpg', 'etc.jpg');
for (x in imgstopreload){
    (new Image).src = imgstopreload[x];
}

Я бы не стал делать это для большого количества больших изображений, потому что страница не загрузится до тех пор, пока изображения не будут готовы, но если вам нужно их подготовить, это работает. Просто поместите его в свой индекс:)

Answer 2

Что такое ответ? Что это представляет?

Предположим, у вас есть список объектов, представляющих изображения с именем imgList:

var imagePreloader = new Image();

if(imgList.length != 0)
{
   imagePreloader.load(function() {
      if(imgList.length != 0)
      {
         var img = imglist.pop();
         imagePreloader.src = img.imgSrc;
      }
      else
      {
         currentTabPanel.show();
      }
   });

   imagePreloader.src = imgList.pop().imgSrc;   
}