Gif图像没有动画

Question

当我使用jquery或javascript将其设置为页面时，为什么gif图像没有动画效果？

var loadingImage = '<img src="./assets/img/loading.gif">';
$("#loading-div").html(loadingImage);

Answer 1

我的代码中没有问题。我只是用相同的代码创建了一个小提琴。

http://jsfiddle.net/FmReg/

var loadingImage = '<img src="http://fc05.deviantart.net/fs71/f/2013/176/3/e/banana_jam_by_hat_kid-d6anoqh.gif">';
$("#loading-div").html(loadingImage);

这应该是图像路径或图像损坏的问题。

Answer 2

如果在执行耗时的同步JS代码之前添加加载映像，例如：

for (var i = 0; i < 100000000; i++) {}

然后JS将冻结UI，图像将不会动画。在某些情况下，可以将工作用于WebWorker，以免冻结用户界面，但通常需要花费更多精力。

此外，在某些浏览器中，如果您在移动到另一个页面之前添加了一个gif，它也不会生成动画。

这些是gif根据我的经验没有动画的最常见的用例，希望它有所帮助。