Javascript/jquery的衰减效果

Javascript/jquery fade effect decay

本文关键字：衰减 jquery Javascript      更新时间：2023-09-26

这一次非常具体，我有以下代码来根据条件循环一些淡出，正如您可以看到的，根据动画的状态略有不同。

现在它正在产生我想要的效果，但它似乎逐渐变慢，直到大约3分钟它完全停止。

我已经到了不能再盯着它看的地步了!谁能给我一些建议，如何使这一个连续循环?

这里有一个小提琴:http://jsfiddle.net/CbNc5/

var glimmerLen = 16;
var initiated = false;
var animateLoop = false;
var timeout;

function glimmerAnimate() {
if (!initiated) {
    timeout = window.setTimeout(function() {glimmerAnimate();}, 2500);
    initiated = true;
} else if (!animateLoop && initiated) {
    $("#glimmer li").fadeTo(1500, 0.5, function(){
        glimmerAnimate();
        animateLoop = true;
    });
} else if (animateLoop) {
    var rangeMax = glimmerLen + 1;
    var randObj = Math.floor(Math.random() * rangeMax);
    $("#glimmer-" + randObj).fadeTo(1500, 0.8, function() {
        $("#glimmer-" + randObj).fadeTo(2000, 0.2);
            glimmerAnimate();
    });
}

}

我已经重写了这个，希望这有帮助(http://jsfiddle.net/CbNc5/5/)

function fadeLoop(e) {
    $(e).fadeTo(Math.random() * 500, 0.2, function () {
        $(this).fadeTo(Math.random() * 500, 1, function () {
            fadeLoop(this);
        });
    });
}
$('li').each(function () {
    fadeLoop(this);
});

注:如果你只想要循环不透明度，你可以使用CSS3，它会更简单

相关文章：