Question

我想做的就是这个功能只会重新启动或循环。请帮忙，谢谢。 =）

这是我的代码：

$(function() {
    $('#text').hide();
    $('#text').delay(600).fadeIn(1500).delay(9000).fadeOut(2000);
    $('#text2').hide();
    $('#text2').delay(13500).fadeIn(1500).delay(9000).fadeOut(2000);
    $('#text3').hide();
    $('#text3').delay(26500).fadeIn(1500).delay(9000).fadeOut(2000);
});

Answer 1

 $(function() {
  function loop() {
   $('#text').hide();
   $('#text').delay(600).fadeIn(1500).delay(9000).fadeOut(2000);
   $('#text2').hide();
   $('#text2').delay(13500).fadeIn(1500).delay(9000).fadeOut(2000);
   $('#text3').hide();
   $('#text3').delay(26500).fadeIn(1500).delay(9000).fadeOut(2000);
   $('classOrTagThatEveryElementHas').promise().done(loop);
  }
  loop();
});

文档： http://api.jquery.com/promise/

JS小提琴： http://jsfiddle.net/RW22m/

Answer 2

fadeIn和fadeOut都接受回调函数作为动画结束后执行的第二个参数。您可以通过将过渡的动态部分放入数组中来利用此功能。在我的代码中，我创建了一个启动转换的函数，然后通过回调函数递归调用自身。每次递归时，下一个索引作为参数传递，用于从数组中检索转换信息。

$(function() {
    $('#text, #text2, #text3').hide();
    var transitions = [
        {id: 'text', delay: 600},
        {id: 'text2', delay: 13500},
        {id: 'text3', delay: 26500}
    ];

    function perform(i){
        $('#' + transitions[i].id).delay(transitions[i].delay).fadeIn(1500).delay(9000).fadeOut(2000, function(){
             perform(++i % transitions.length);
        });     
    }
    perform(0);                          
});

JS小提琴： http://jsfiddle.net/z5Wcd/

jQuery函数重启或循环

2 个答案: