javascript - 没有悬停的CSS父子循环过渡

Question

这是我的测试。 http://jsfiddle.net/othoap/XdJN5/

在我的 html5 页面上，我有这个成功触发 css 的 js。

 <script>
$(document).click(function(){
   $("img").fadeOut('slow', function() {
       $("img").removeClass();
      });
});
</script>

所以我不想要带有鼠标触发器的 css。只是一个无限循环。

正如您在 JSfiddle(MAN 多么棒的站点)示例中看到的那样。父动画循环正常，但 child 只在开始时触发一次。我也不明白为什么 z-index 不会将 child 推到 parent 身后。

一如既往地感谢您的宝贵时间。

Answer 1

你的动画不是无限的，因为你还没有将 child 设置为无限:

你有这个:

-moz-animation-iteration-count: slidedown;
-webkit-animation-iteration-count: slidedown;

应该是这样的:

-moz-animation-iteration-count: infinite;
-webkit-animation-iteration-count: infinite;

至于z-index，它不会将 child 推到其 parent 身后。如果你想要它在后面，它不应该是一个 child 。