为什么gif动画只能在jQuery中播放一次? [英] Why the gif animation only play one time in jQuery?

问题描述

我有一个包含两个div的小页面，单击第一个div会弹出第二个div并隐藏第一个div，第二个div上有三个gif文件，一旦弹出第二个div就会开始播放动画出去.单击第二个div会弹出第一个div并隐藏第二个div.我想要的是，如果我再次回到第二个div，动画将再次播放，但通常不会，只是第一次.为什么?看来在jQuery中，动画仅在div加载时才第一次播放，有人知道答案吗?非常感谢！

I have a small page with two divs, clicked on the first div will pop up the second div and hide the first one, there are three gif files on the second div and the animation will begin to play once the second div poped out. Clicked on the second div will pop out the first div and hide the second one. What I want to is that, if I back to second div again, the animation will play again but in autually it does not, it only for the first time. Why? It seems that in jQuery, the animation will only play for the first time when the div loaded, anyone knows the answers? Thanks a lot!

推荐答案

GIF模拟不能由Javascript控制.据我所知，它什么时候应该启动甚至还没有定义.大多数浏览器在首次加载图像时启动它.我从未见过在隐藏图像后重新显示该图像时，浏览器会重新启动该动画. (如果是无尽的动画，则动画会在某个随机点继续.)

The GIF animiation cannot be controlled by Javascript. As far as I know, it's even undefined when it's supposed to start. Most browser start it when the image is first loaded. I have never seen that a browser restarts the animation when the image is re-shown after it was hidden. (If it's an endless animation, the animation continues at some random point.)

要获得理想的效果，您可以尝试通过其搜索页面上的+1按钮(登录时)来实现与Google相同的效果.他们使用具有多个框架的单个PNG(请参阅如何使用jquery创建google plus一键式效果?)和JavaScript来更改background-position CSS属性以制作动画.

To achieve the desired effect, you could try to implement the same effect as Google with their +1 button on their search page (when you're logged in). They use a single PNG with multiple frames (see How to create the google plus one button effect using jquery?) and JavaScript to change the background-position CSS attribute to do the animation.

这篇关于为什么gif动画只能在jQuery中播放一次?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！