图片延迟加载

Question

做了一个生出图片后加载的jquery的事件，但是生成图片慢一些，导致图片显示不错来，需要刷新页面，怎么才能解决这根问题呢？我实在thinksns里应用的，用过一个js叫但是不起作用。求高手帮忙解决

Answer 1

用onload。onload="js()";图片加载完再执行js。

Answer 2

需要先执行jquery生成图片，然后才能加载，图片路径是确定的。虽然是生成图片的程序先进行但是图片生成需要时间，加载路径却不需要，导致生成的图片加载不上。

Answer 3

延时加载 你的是按DIV 布局先后来加载 
左右布局时 左边 没完成 右边是加载不出来的最好是 横向布局

Answer 4

http://download.csdn.net/detail/wwfgu00ing/2563888

Answer 5

好像有一个叫jquery lazy的插件。可以解决。

Answer 6

基于jQuery的 lazyload 可以完美解决这个问题，很容易使用的。

Answer 7

用jquery的preload$.preloadImages = function() {
for (var i = 0; i<arguments.length; i++) {
img = new Image();
img.src = arguments[i];
}
}
$.preloadImages (
"path_to_image_array",
"path_to_image_array",
"path_to_image_array"
);

Answer 8

js放在body最后，图片能延迟加载就延迟。

Answer 9

//缩略图
jQuery.fn.LoadImage=function(scaling,width,height,loadpic){
    if(loadpic==null)loadpic="../images/msg_img/loading.gif";
return this.each(function(){
   var t=$(this);
   var src=$(this).attr("src")
   var img=new Image();
   img.src=src;
   //自动缩放图片
   var autoScaling=function(){
    if(scaling){
     if(img.width>0 && img.height>0){ 
           if(img.width/img.height>=width/height){ 
               if(img.width>width){ 
                   t.width(width); 
                   t.height((img.height*width)/img.width); 
               }else{ 
                   t.width(img.width); 
                   t.height(img.height); 
               } 
           } 
           else{ 
               if(img.height>height){ 
                   t.height(height); 
                   t.width((img.width*height)/img.height); 
               }else{ 
                   t.width(img.width); 
                   t.height(img.height); 
               } 
           } 
       } 
    } 
   }
   //处理ff下会自动读取缓存图片
   if(img.complete){
    autoScaling();
      return;
   }
   $(this).attr("src","");
   var loading=$("<img alt=\"加载中...\" title=\"图片加载中...\" src=\""+loadpic+"\" />");
  
   t.hide();
   t.after(loading);
   $(img).load(function(){
    autoScaling();
    loading.remove();
    t.attr("src",this.src);
    t.show();
//$('.photo_prev a,.photo_next a').height($('#big-pic img').height());
   });
  });
}