加载gif直到图像完全加载。然后淡入

Question

我现在就设置了这个：http://jsfiddle.net/FMqbP/1/

我想加载this animation，直到缩略图加载完毕，然后我想让缩略图淡入。最好的方法是什么？

我知道这可以通过load函数用简单的图像来完成，但在我的情况下，我需要一个包含内容的整个div来表现相似。

Answer 1

您可以使用JQuery预加载图像。有几种技术，但我见过的是。

(function($) {
  var cache = [];
  // Arguments are image paths relative to the current page.
  $.preLoadImages = function() {
    var args_len = arguments.length;
    for (var i = args_len; i--;) {
      var cacheImage = document.createElement('img');
      cacheImage.src = arguments[i];
      cache.push(cacheImage);
    }
  }
})(jQuery)

然后你可以做

jQuery.preLoadImages("foo.gif", "/path/to/foo2.gif");

此解决方案以及有关它的更多信息位于http://engineeredweb.com/blog/09/12/preloading-images-jquery-and-javascript