Question

有没有办法预加载GIF动画？我知道有几个问题可以解决这个问题，但我对它们没有好运。我的网站上有一个简单的叠加层，它有一个动画gif作为背景。当网站加载后，它就会淡出。

$(window).load(function() {
    $('#overlay-preload').delay(1000).fadeOut('fast');
});

困难在于，特别是在移动设备上，因为网站正在加载动画gif，你会得到一个非常交错的gif加载。我已经尝试了一些预加载脚本，但没有运气。我不确定我是否遗漏了什么？ gif是4kb所以它不是很大，你可以在这里查看它：http://i.imgur.com/TpeQfQn.gif所以在移动设备上你会得到这种交错的填充效果。

有任何想法或建议吗？

Answer 1

你需要在加载gif时将整个页面的加载推迟到回调中，否则你总是会在动画中出现口吃：

<强>的JavaScript

loading_gif = new Image();
loading_gif.src = 'path/to/loader.gif';

loading_gif.onload = function () {
    // start loading your page (or loading animation)
};

然而，这大大增加了加载时间，错误。为什么不使用CSS animation？

在其他任何事情之前加载GIF动画

1 个答案: