如何让 CSS3 动画循环播放答案

【问题标题】：How to make CSS3 animation play on a loop如何让 CSS3 动画循环播放
【发布时间】：2014-05-02 04:21:28
【问题描述】：

我有这个设置，我想重复播放。我对 jQuery 不是很好，所以想知道是否有人可以告诉我怎么做？

$('.title1').fadeIn('fast', function() {
    $('div').addClass('animated pulse');
});

$('div').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend    
animationend', function() {
    $('.title1').fadeOut(2000);
});

【问题讨论】：

stackoverflow.com/questions/4713477/…
看看setInterval()
有什么理由不能使用 CSS 代替 fadeOut()？您可以将其添加到 CSS 动画的末尾。如果您发布您的 CSS 动画代码，我很乐意向您展示我的意思。
嘿，感谢您的回复，我很想知道您建议我如何使用 css 实现这一目标。我的滑块看起来像这样jsfiddle.net/akZ48/5，我希望每个标题都淡出脉冲，然后在每张幻灯片上淡出。

标签： jquery html css loops

【解决方案1】：

http://jsfiddle.net/jFIT/86KLb/7/

只需将它全部包装在一个函数中，然后从fadeOut的回调中调用它..

 doIt();

function doIt(){
  $('.title1').fadeIn('fast', function() {
      $('div').addClass('animated pulse');
  })
  $('div').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend    animationend', function() {
    $('.title1').fadeOut(2000, function() {doIt();});
  });
};

【讨论】：

@user2498890 没问题 - 如果它解决了您的问题，请接受答案。