javascript - 加载页面上所有其他文件后加载动画 gif

Question

我有一个相当大的动画 gif(几个 mb!)，并且我不想在加载 gif 之前阻止页面上加载其余元素。您将使用什么技术来做到这一点？我不是在这里要求代码，只是为了指出正确的方向...如果它是 jQuery，或者...其他东西，也许？我很想知道类似的最佳实践是什么。

Answer 1

如果您已经在使用 jQuery，那么这非常简单: HTML:

<img id='the_image' style='width:100px;height:200px' src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'>

Javascript:

$(function() {
    $('#the_image').attr('src','http://example.com/image.gif');
});

我使用的默认 src 只是一个非常简单的内联透明 gif，以保持其位置，直到调用真实图像。

演示: http://jsfiddle.net/trex005/cmkLn87L/