jquery - 预加载网站

Question

我是网络开发的新手。我目前在一个有很多产品图片的网站上工作，因此网站的整个页面不会一次加载，给人留下不好的印象，请指导我如何预加载网站的所有图片。无论方法是使用 jquery 还是任何插件。请帮我！

Answer 1

您可以在 jQuery 中使用 .load() 事件

var imagecount = 10;

$('img').load(function() {
   // Image load complete
   if(imagecount == 0)
      // Loading of all images are over
      LoadingComplete();
   else {
      imagecount--;
      // Here you can update the progress bar.
   }
});

要显示进度条，您可以使用jQuery 进度条插件

 $( "#progressbar" ).progressbar({
    value: 1
 });

Answer 2

http://www.krio.me/scripttest/imgLoader/

我使用了上述网站提供的插件。之所以特别是因为：

1) 图像只有在完全下载后才会显示

2) 即使下载速度低至 30kbps，它也能快速预加载图像

3) 你不需要做太多，它的主要目的是帮助 web 开发者和设计者改进他们的用户界面。