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用不同的顏色脈動？

回答

相關問題