如何使用wordpress在点击（如9GaG.com）上播放GIF？

我需要在wordpress网站上实现这个“gif播放器”，因为gif页面高达6mb，所以性能真的很糟糕

我已经阅读了这个Onclick使用jQuery播放GIF图像并从头开始也是这个如何从开始onclick函数播放动画GIF几乎是一个解决方案，但我不知道如何在每个条目中使用wordpress

9gag.com做得很好; 显示预览图像，再现gif onclick，并在再次单击时停止gif。 如果再次单击，则从头开始播放gif

我如何用wordpress实现这一目标？

Answer 1

9GAG基本上做的是它有两个图像 – 一个是动画GIF，另一个是JPG。

在您单击之前，它显示了JPG文件。 点击它后，它将GIF加载到相同的标签中，让你认为它“播放”了GIF图像。

如果再次单击它，它会将JPG文件加载回标记，并让您认为它“暂停”了GIF图像。

图像处理，就像只使用一个GIF并暂停和播放它一样，实际上很难实现 – 这种方法是更好的方法之一。

这是一些代码：

另外，如果你想要速度，我认为9GAG是通过预先加载GIF来实现的，如下所示：

希望这可以帮助。

Answer 2

如果您不想暂停，可以轻松地重新播放gif文件。 只需触发点击并将gif重新加载到图像标记中。

your_image = document.getElementById或者您想获取对图像的引用。 然后为点击设置一个事件监听器。

然后your_image.src = your_image.src; 而且gif会再次运行。