可替代fadeOut()来创建脉冲效果

Question

我正在使用这样的递归函数在页面上的div上创建连续脉冲效果，并且它正在工作。但是，看起来fadeOut()从文档流中删除了div元素，因此页面上其他一些元素的位置发生了移位。是否有一个替代这个功能，提供重复脉冲效果的相同功能?

(function pulse(){
            if(needStop) {
                needStop = false;
                return;
            }
        $('#player1,#score1').delay(200).fadeOut('slow').delay(50).fadeIn('slow',pulse);
    })();

Answer 1

如果你不介意使用插件，这里有一个很好的jQuery插件:

http://james.padolsey.com/javascript/simple-pulse-plugin-for-jquery/

更新链接:

http://jsoverson.github.com/jquery.pulse.js/

Answer 2

尝试设置它的不透明度。

$('#player1,#score1').delay(200).animate({
    opacity: 0
}, 'slow', function(){
    setTimeout(function(){
        $('#player1,#score1').delay(50).animate({
            opacity: 0
        }, 'slow', pulse );
);

http://api.jquery.com/animate/

https://developer.mozilla.org/en/docs/DOM/window.setTimeout

Answer 3

你也可以使用CSS，也许更少的代码，这个源代码是伟大的:http://daneden.me/animate/build/

所有这些效果都可以通过添加和删除CSS类来实现