0

我已经成功地让它工作了，但是我在网站上有很多我想要脉冲的按钮，目前我正在使用 id 执行此操作，但我想转向更灵活的东西并使用一个类来选择哪些按钮应该脉冲. 这是一个JSFiddle

我看到的问题，至少在我的浏览器中（MAC 上的 Google Chrome 25.0）是按钮按预期脉冲，但脉冲输出很慢，然后下一个脉冲需要几秒钟才能触发，然后它需要下一次更改甚至更长，它似乎被某些东西所困扰。以下是动画脚本：

function pulseIn() {
    $(".pulse").animate({
        backgroundColor: "rgba(144,238,144,0.5)"
    }, 1000, 'swing', function () {
        pulseOut();
    });
}

function pulseOut() {
    $(".pulse").animate({
        backgroundColor: "rgba(0,0,0,0.5)"
    }, 1000, 'swing', function () {
        pulseIn();
    });
}

pulseIn();
4

2 回答 2

1

我已经为你更新了你的代码。这应该通过一个特定的控制来进行脉冲输入和脉冲输出。在您的代码中，一旦第一个控件完成脉冲输入，您就执行pulseOut了选择.pulse包括第二个在内的所有控件，即使它还没有完成运行pulseIn（解释起来有点混乱，但希望您能明白要点）。

$('.pulse').each(function(){
    pulseIn($(this));
});

function pulseIn(control) {
    control.animate({
        backgroundColor: "rgba(144,238,144,0.5)"
    }, 1000, 'swing', function () {
        pulseOut(control);
    });
}

function pulseOut(control) {
    control.animate({
        backgroundColor: "rgba(0,0,0,0.5)"
    }, 1000, 'swing', function () {
        pulseIn(control);
    });
}
于 2013-03-11T01:06:53.757 回答
0

我写了一个小片段，可以在不使用 jQuery UI 的情况下使用 - 只有 jQuery。

function fadeBtn(el, fadeOutSpeed, fadeInSpeed){
    el.fadeOut(fadeOutSpeed, function(){
        jQuery(this).fadeIn(fadeInSpeed, function(){
            fadeBtn(el, fadeOutSpeed, fadeInSpeed);
        });
    });
}

fadeBtn(jQuery('.pulseBtn'), 750, 2500);

jsFiddle：http: //jsfiddle.net/f5q6kuse/

于 2014-08-08T15:17:14.490 回答