javascript - 使用 JavaScript 制作动画 GIF 只循环一次

Question

我正在尝试在网站上制作一个介绍性的动画 Logo ，我希望动画播放一次然后触发一个简短的脚本，该脚本将显示一个“继续”按钮。我希望 HTML 中有一种方法可以告诉 GIF 只循环一次，但我找不到任何这样的属性或标签。所以现在在GIF动画完成后找不到任何触发函数，这让我抓狂!

我将不胜感激任何帮助解决这个问题或被引导到更好的动画格式来解决所有这些废话。

Answer 1

我查看了 http://gifshake.com 上的代码, 看起来该网站使用 http://gifshake.com/assets/application-0d2f240603d4b373f1d6768aa71baf42.js将其 gif 转换为交互式 Canvas 。如果您想知道，他们使用的代码是:

var sup1 = new SuperGif({ gif: document.getElementById('thegif') } );
sup1.load();

其中带有 id="thegif" 的元素是带有 src 属性的图像，其中包含 gif 图像的 url。无论如何，我认为没有真正简单的方法来控制这样的 gif，除了像他们一样导入那些相同的库。对于像您这样的情况，我认为这不是最实用的解决方案。您最好在 GIMP 等图像编辑器中简单地编辑 gif，并将其设置为只播放一次，而不是无限播放。您可以打开 GIF，然后按 Ctrl+E(导出)，然后将其另存为 gif。然后在更改更多选项时，将其另存为动画并取消选中“永远循环”复选框。希望对您有所帮助。

TL;DR:仅靠大量的 JavaScript 是不可能做到这一点的；你最好自己编辑 gif。