动画gif无法在Chrome中正常运行

Question

让gif在Chrome中运行似乎有问题。它在FireFox和Opera中运行良好，但在Chrome中它似乎只在我不停地滚动一下时起作用。知道我正在构建一个带有gif的响应式视差网站可能会很有用。我找不到任何关于此的信息，只是Chrome有时根本不会播放gif。

Answer 1

不确定您是否还需要修复此问题，但这是我在GIF是背景图片时必须执行的操作。 Chrome会缓存GIF，因此只播放一次。你必须使用一些jQuery“强制”动画再次播放。

<script type="text/javascript">
$(document).ready(function () {
    $("#myContainer").css("background-image", "url(/images/myAnimation.gif?"+ Math.random() + ")" );
});
</script>

你几乎在GIF网址的末尾添加一个随机数，以强制浏览器重放动画，因为它认为它是图像的新实例。 我仍然会将GIF放在元素背景的CSS中，以防浏览器出现JS问题。

有点hacky但是有效。

Answer 2

问题是gif被设置为100％的背景。当把它作为图像放在html中时，它再次起作用。这并不能解释原因，但确实提供了解决方法。