平铺一个异步加载图像 - 把一个<img>和背景URL

Question

之间对于很多的小缩略图的网站，我想用一个占位符，GIF，而每个图像加载。这需要像下面的代码：

$('.this_img').each(function(){ 
    var $this_img = $(this); 
    var $this_src = $(this).find('.sliderImage:first').attr('src'); 
    var img = new Image(); 
    // wrap our new image in jQuery, then: 
    $(img) 
    // set minimum dimensions 
    .css({ 
    'min-height': '35px', 
    'min-width': '40px' 
    }) 
    // once the image has loaded, execute this code 
    .load(function() { 
    // set the image hidden by default  
    $(this).hide(); 

    // with the holding div #loader, apply: 
    $this_img 
     // remove the loading class (so no background spinner), 
     .removeClass('loading') 
     // then insert our image 
     .prepend(this); 

    // fade our image in to create a nice effect 
    $(this).fadeIn(); 
    }) 

    // if there was an error loading the image, react accordingly 
    .error(function() { 
    // notify the user that the image could not be loaded 
    }) 

    // *finally*, set the src attribute of the new image to our image 
    .attr('src', $this_src); 

这种运作良好，在样式表中指定的占位符，但我希望能够平铺这些图像，如果他们太短或狭窄，背景CSS是显而易见的方式做到这一点，但它无法与异步图像加载兼容的，据我所知。

我的问题：有没有可用于平铺<img>标记的jQuery（或CSS3）？

或者，有没有办法做一个形象的台异步加载，然后将其粘贴到后台的CSS属性？这听起来有点太神奇了，但也许它有用。

Answer 1

你可以发布你的HTML标记结构？在盲目，否则，但你尝试modifyu包含div的background属性？

// your callback function 

function() { 
    // set the image hidden by default  
    $(this).hide(); 

    // with the holding div #loader, apply: 
    $this_img 
     // remove the loading class (so no background spinner), 
     .removeClass('loading') 
     // then insert our image 
    //.prepend(this) 

.css（'background'，'transparent url（“'+ $ this_src +'”）top left repeat'）;

// fade our image in to create a nice effect 
    $(this).fadeIn(); 
    }