3

我正在处理照片库，我希望能够在加载主图像之前显示 gif 预加载器，然后显示主图像。

所以，这就是我得到的：

我有一个#photo_place包含主要照片的 div。这取决于用户选择的缩略图。当用户确实选择了缩略图时，会触发此功能：

function gallery(icon){

    $('#photo_place').css('background-image','url("../images/'+icon+'.png")');

}

现在，我想要的是首先在#photo_place 显示一个预加载器 gif，在某个地方加载选定的图像……当加载该图像时，用主图像替换预加载器。

所以也许是这样的？

function gallery(icon){
    $('#photo_place').css('background-image','url("../images/preloader.gif")');
    load.in.image'images/'+icon+'.png';

    if(load.in.image == true){
        $('#photo_place').css('background-image','url("loaded image")');
    }
}

当然，那不是真正的 JS，但这样的东西应该可以正常工作吗？

有任何想法吗？

谢谢

4

1 回答 1

5

也许你正在寻找这样的东西？

function gallery(icon) {
   var preLoader = '../images/preloader.gif';
   var imagePath = '../images/' + icon + '.png';

   $('#photo_place').css('background-image','url("../images/preloader.gif")');

   var image = new Image();

   image.onload = function() {
      $('#photo_place').css('background-image', imagePath);
   }
   image.src = imagePath;
}

还检查图像类参考：http ://www.javascriptkit.com/jsref/image.shtml

于 2012-05-05T19:11:30.777 回答