1

我想每隔几秒淡出第一个 div，这段代码工作一次：

$('.comment:first').delay(4000).fadeOut();

并尝试使其持续运行，我一直在尝试执行回调函数或循环，但没有发现任何乐趣。我不熟悉这些类型的功能。到目前为止，这是我的尝试：

$('.comment:first').delay(4000).fadeOut( function(){
                $(this).delay(4000).fadeOut();
});

编辑： div.comment:first 淡出后，第二个 div.comment 现在将排在第一位，所以我想然后淡出该 div 并继续运行该功能。我不希望第一个 div.comment 淡出。抱歉造成混乱。

4

5 回答 5

3

这将在您需要的最后一个元素上停止
（否则删除if并使用.eq(++C % N)！:)

jsBin 演示

$('.comment:gt(0)').hide();   // hide all but first one
var N = $('.comment').length; // count comments
var C = 0;             // just a useful counter

function loop(){
     if(++C < N){       // this will prevent the loop to run infinitely
         $('.comment').delay(1000).fadeTo(400,0).eq(C).fadeTo(400,1,loop);
     }
}

loop();

循环解释：

$('.comment')           // all comments...
    .delay(1000)        // wait for some time and...
    .fadeTo(400,0)      // fadeTo 0
    .eq(C)              // just, the one which index equals to preIncremented C
    .fadeTo(400,1,loop) // fade him to 1 and callback the LOOP !
;

编辑
在OP给我留下评论后：

jsBin 演示

var N = $('.comment').length;
var C = -1;

function loop(){
     if(++C < N)
     $('.comment').eq(C).delay(1000).slideUp(400, loop);
}

loop();
于 2013-01-11T01:01:20.057 回答
1

您是否尝试过使用setInterval：

setInterval(function(){
    $('.comment:first').fadeOut();
}, 4000);
于 2013-01-11T00:33:05.680 回答
0

只需使用间隔

window.setInterval(function(){ $('.comment:first').fadeOut(); }, 4000);

要使其切换淡入淡出：

setInterval(function(){ 
 if( $('.comment:first:hidden').length > 0 ){
   $('.comment:first').fadeIn();
 }else{
   $('.comment:first').fadeOut();
 }
}, 4000);
于 2013-01-11T00:33:04.557 回答
0

这是一个从第二个动画的完整回调中重复调用的函数，该函数需要在元素淡出后显示元素。

var $commentFirst=$('.comment:first')

function fadeDiv(){
   $commentFirst.delay(4000).fadeOut( function(){
          /* fade it back in, call function again when done*/
          $commentFirst.delay(4000).fadeIn(fadeDiv);
   });

}
/* on page load*/
$(function(){
    fadeDiv();
})
于 2013-01-11T00:38:10.280 回答
0

可以这样调用 fadeOut 函数（http://api.jquery.com/fadeOut/）：

.fadeOut( [duration ] [, complete ] )

我已经有一段时间没有使用它了，但我会说你应该 1) 将持续时间写为第一个参数 2) 用作回调一个使 div 淡入的函数

然后在fadeIn的回调中指向启动fadeOut的原始函数，这样你就会有一个循环FadeOut > FadeIn > FadeOut > ...

于 2013-01-11T00:40:57.517 回答