Twitter Bootstrap用不同的颜色脉动？

我正在使用Twitter引导程序。我的按钮的课程通常是btn btn-default，我想将课程更改为btn btn-success，以便按钮呈绿色。然后一个漂亮的小三脉动，然后返回到默认颜色。Twitter Bootstrap用不同的颜色脉动？

到目前为止，我已经得到了最好的是：

$('#myBtn').removeClass('btn btn-default').addClass('btn btn-success'); 

for(i=0;i<3;i++) { 
    $(#myBtn).fadeTo('slow', 0.5).fadeTo('slow', 1.0); 
    } 

$('#myBtn').removeClass('btn btn-success').addClass('btn btn-default');

这里的问题是，它只是瞬间改变颜色回默认，而动画继续。有任何想法吗？我看过JQuery Color，没有任何东西像现成的。

来源

2013-12-23 Eric Banderhide

你必须使用animate函数。

这里是仅具有一个样品 “fadding”

http://jsfiddle.net/wVmG7/1/

$("#btnTest").click(function(){ 
    $('#myBtn').removeClass('btn btn-default').addClass('btn btn-success'); 
    $("#myBtn").animate({ 
    opacity: 0.3 
    }, 1000, function() { 
    $(this).after($("#myBtn").animate({ 
     opacity: 1 
    }, 1000, function() { 
      $(this).after($("#myBtn").removeClass('btn btn-success').addClass('btn btn-default')) 
    }) 
    ) 
    }); 
});

来源

2013-12-23 16:32:48

渐变发生异步，所以你需要等到他们完成之前再次转换。我认为你可以通过链接在一起，并在完成最后一次延迟后做最后一步来作为替代。需要注意的是“慢” = 600毫秒过渡，因此1200个值...

$('#myBtn').removeClass('btn btn-default').addClass('btn btn-success'); 

$('#myBtn').fadeTo('slow', 0.5).fadeTo('slow', 1.0).delay(1200) 
     .fadeTo('slow', 0.5).fadeTo('slow', 1.0).delay(1200) 
     .fadeTo('slow', 0.5).fadeTo('slow', 1.0).delay(1200, 
     function() { 
      $('#myBtn').removeClass('btn btn-success').addClass('btn btn-default'); 
     });

http://jsfiddle.net/8C3SA/

如果你想要的东西有点整洁（在jQuery插件的形式），退房@Doug Neiner的答案在这里：jQuery: fade div in and out multiple times

来源

2013-12-23 16:16:35 geedubb

Twitter Bootstrap用不同的颜色脉动？

回答

相关问题