如何玩GIF动画从一开始的onclick功能(How to play animated GIF fr

我有两个div：一个用于静态图像（JPG格式），另一种为动画形象（GIF）

像这样：

<div class="badge-animated-container-static gif-post "><img class="badge-item-img" alt="Nunca dos viajes" src="http://127.0.0.1:4001/wordpress/wp-content/uploads/2013/11/nevertwotrips.jpg" />
<span class="play">Play</span></div>
<div class="badge-animated-container-animated hide"><img class="badge-item-animated-img" alt="Nunca dos viajes" src="http://127.0.0.1:4001/wordpress/wp-content/uploads/2013/11/nevertwotrips.gif" /></div>

我用这个JavaScript执行的onClick功能，让喜欢，当我点击了静态的div ..用CSS显示消失：没有，我的动画DIV来了，我要显示的GIF。 我的问题是，当我的网站负载...动画的div隐藏着GIF是打不GIF回采......我希望能够当我点击了它从头开始播放的GIF静态图像。

我怎样才能做到这一点？

<script>
$('.badge-animated-container-static').click(function() {
$(this).addClass('hide');
$('.badge-animated-container-animated').removeClass('hide');
});

$('.badge-animated-container-animated').click(function(){
$(this).addClass('hide');
$('.badge-animated-container-static').removeClass('hide');
});
</script>

文章来源: How to play animated GIF from the beginning onclick function