使用 jQueryUI-tabs 预加载 AJAX 内容的图像

发布于 2024-08-23 06:40:24 字数 428 浏览 12 评论 0原文

所以我有一个使用 ui-tabs 的非常好的应用程序。问题是,我一生都无法找到一种在显示选项卡面板之前在我的 ajax 内容中预加载图像的方法。我能想到的唯一方法是创建自己的 ajax 功能来加载选项卡面板内容,并在 ajax 调用中添加类似的内容:

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

}

但我认为一定有更好的方法来解决这个问题使用 jQueryUi.tabs() 对象中内置的 AJAX 方法和事件..我只是认为我没有看到它...arg..有什么想法吗?

So I've got a pretty nice application going using ui-tabs.. problem is, I cannot for the life of me figure out a way to pre-load images in my ajax content before the tab panel is shown. The only way I can think of is to create my own ajax functionality for the loading of tab-panel content, and adding something like this to the ajax call:

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

}

But I'm thinking there's GOT to be a better way of going about this using the built in AJAX methods and events in the jQueryUi.tabs() object.. I just don't think I'm seeing it... arg.. any ideas??

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

虚拟世界 2024-08-30 06:40:24

什么是回应?它代表什么?

假设您有一个表示图像的对象列表,称为 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;   
}

What is response? What does it represent?

Assume you have a list of objects representing images called 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;   
}
不知在何时 2024-08-30 06:40:24

这是我有时使用的一个肮脏的小脚本,但它效果很好:

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

我不会对大量大图像执行此操作,因为在图像完成之前页面不会完成加载,但如果您必须准备好它们,它就可以工作。只需将其放入您的索引即可:)

This is a dirty little script I use sometimes but it works great:

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

I wouldn't do this for lots of big images because the page won't finish loading until the images are done, but if you have to have them ready, it works. Just put it in your index :)

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文