在最后一帧使用JS冻结Gif

Question

我试图在我的网站上播放gif动画，我希望它在最后一帧上冻结。我在其他地方使用此代码使其工作，但它将跳回第一帧或完全消失。任何帮助将不胜感激。

<img src="http://s12.postimg.org/wq43xqknx/logoani.gif" id="img1" style="float: left"/>

setTimeout(function () {
setInterval(function () {
    $('#img1').attr('src', $('#img1').attr('src'))
}, 1)
}, 1000)

这里是jsfiddle：http://jsfiddle.net/m6e6n/6/

Answer 1

目前JavaScript没有提供处理动画GIF内部框架的界面，你必须找到一种方法来做到这一点但是......

我绝对不鼓励您使用该脚本

看看你告诉CPU每毫秒执行一次，即每秒1000次：

• 遍历HTML文档以查找元素＆＃34; img1＆＃34;
• 更改其属性＆＃34; src＆＃34;到....
• ...再次遍历同一节点的HTML文档
• 读取其属性src
• 将其分配给1
中找到的元素
• 然后，浏览器将转到缓存并找到图像
• 根据浏览器的不同，可能会对图像进行解码和渲染。它应该从第1帧开始，但谁知道

所以如果浏览器还有一些时间来完成其他任务，你可以感谢上帝。

此外，假设您不关心用户的超载情况。计算机，您必须非常精确地微调时序以匹配GIF帧速率。坏消息是，如果帧速率很快，那么在不同的浏览器甚至不同的计算机上都无法实现这一点，更不用说移动设备了。

那你能做什么？我建议您播放GIF，然后用最后一帧的静止图像替换它。只计算一次迭代需要多长时间，然后发出超时以使用静止图像更改gif。