1

对于有很多小缩略图的网站，我想在加载每个图像时使用占位符 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 是这样做的明显方法，但它与异步图像加载不兼容， AFAIK。

我的问题：是否有任何 jQuery（或 CSS3）可用于平铺<img>标签？

或者，有没有办法异步加载图像，然后将其粘贴到背景 css 属性中？这听起来有点太神奇了，但也许它有效。

4

1 回答 1

1

你能发布你的html标记结构吗？否则，在盲人中，但是您是否尝试修改包含 div 的背景属性？

// 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','透明url("'+$this_src+'") 左上重复');

    // fade our image in to create a nice effect
    $(this).fadeIn();
  }
于 2009-07-29T10:27:34.437 回答