使用Javascript设置GIF循环计数和发布停止事件

Question

是否可以使用javascript设置GIF图像的循环次数，然后在停止播放时发布事件？

例如：

//html code
<img src="myImage.gif" id="img1"/>

//Javascript code
var image = document.getElementById('img1');

//Image must stop playing after 3 loops
image.setLoopCount = 3;

Answer 1

以下是我建议的方式：

• 从gif文件中提取帧（您可以使用for instace在线进行 - ＆gt; http://imgops.com/）
• 使用javascript更改图片，模拟动画（这样你就可以跟踪你做了多少循环）

这是一个jsFiddle链接http://jsfiddle.net/qustosh/n5zWH/9/ 我用过jQuery。我做了三个循环，最后我抛出了一个回调函数。

Answer 2

对于设计方解决方案，您可以将GIF图像设置为仅使用Photoshop循环一定次数。然后只需使用window.setTimeout(callback, milliseconds)来触发自定义事件。

您可以从用于显示动画的每个帧的间隔计算超时时间。