2

我在一个类下有不同的元素,我希望它们在无限循环中随机淡入和淡出。我现在可以让它们随机淡入,但坚持淡出元素。

另一件事是,在淡出之后,我想延迟几秒钟,然后再将它们淡入。

这是我的代码片段,希望对您有所帮助。

$(document).ready(function () {
    $('.share').each(function(i){
        var rand = 1 + Math.floor(Math.random() * 7);//max of random 7 seconds
        $(this).fadeIn(rand*1000).delay(500).fadeOut(); 
    });
});
4

3 回答 3

3

如果您希望淡入淡出之间的间隔也是随机的,您可以使用这个:

$('.share').each(function(i) {
    loopInfinitely($(this));
});

function loopInfinitely(elem) {
    var rand = 1 + Math.floor(Math.random() * 7) * 1000;//max of random 7 seconds
    setTimeout(function() {
        elem.fadeIn(rand).delay(300).fadeOut(rand);
        loopInfinitely(elem);  
    }, rand);
}


如果您还希望元素按顺序出现和消失,可以使用以下命令:

loopInfinitely($('.share'));

function loopInfinitely(elems) {
    var rand = 1 + Math.floor(Math.random() * 7) * 1000;//max of random 7 seconds
    setTimeout(function() {
        var i = 0;
        (function advanceElem() {
            if (elems.length <= i) {
                loopInfinitely(elems);
                return;
            }
            elems.eq(i).fadeIn(rand).delay(300).fadeOut(rand);
            setTimeout(advanceElem, rand*2+300);
            i++;
        })();
    }, rand);
}

让我知道这是如何工作的。

于 2012-08-07T04:11:05.947 回答
1

您可以使用常规 JavaScript 计时器定期调用您的代码。

setInterval(function() 
    { 
        $('.share').each(function(i) 
        {
             var rand = 1 + Math.floor(Math.random() * 7);//max of random 7 seconds
             $(this).fadeIn(rand*1000).delay(500).fadeOut(); 
        }) 
    },  3000);
于 2012-08-07T04:08:50.030 回答
0

在里面做一个fade_element_in()函数,和一个函数。然后在每个函数中使用 Javascript 的函数在您喜欢的延迟后调用另一个函数。中提琴,无限循环。$('.share').fadeIn()fade_element_out()setInterval

于 2012-08-07T04:08:35.507 回答