jQuery   发布时间:2022-04-19  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了使用jQuery的background-image预加载器大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在开发一个背景图像密集的网站.由于一些图像很大,页面的美学吸引力将不可避免地受到初始加载,可能持续几秒钟.

所以我试图用jQuery创建一个背景图像预加载器,这里是我所在的位置:

$(document).ready(function(E){
  $('*')
    .each(function(){
        if($(this).css('BACkground-image') != 'none'){

            //so,i can get the path,where do i go from here?
            alert($(this).css('BACkground-image').slice(5,-2));

        }
    });
});

我使用了一个Image()对象数组,使用从迭代器中@L_772_5@的路径加载图像,但是我迷失了从这里开始的地方.

如何确定阵列中的所有图像何时“已加载”,以便我可以调用一个函数来淡出预加载窗帘或其他东西?

解决方法

你应该能够完成这样的事情(未经测试!):

$(document).ready(function(E){

   // get a collection of all elements with a BG image
   var bgImages = $('*').filter(function(){
       return $(this).css('BACkground-image') != 'none');

   // get a collection of new images,assigning the sources from the original collection
   }).map(function() {
       return $("<img />").attr("src",$(this).css('BACkground-image').slice(5,-2));
   });

   var len = bgImages.length;
   var loadCounter = 0;

   // use an onload counter to keep track of which ones have loaded
   bgImages.load(function() {
      loadCounter++;
      if(loadCounter == len) {

         // we have all loaded
         // fade out curtain
      }
   }).each(function() {

      // if we have been pulled up from cache,manually trigger onload
      if (this.completE) $(this).trigger("load");
   });
});

大佬总结

以上是大佬教程为你收集整理的使用jQuery的background-image预加载器全部内容,希望文章能够帮你解决使用jQuery的background-image预加载器所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。