0

cssの背景を2色の間で点滅させようとしています。最善の解決策は、同様の質問に示されている再帰関数を使用することであるように思われました。

(function pulse(){
        $('#my_div').delay(100).css("background-color","blue").delay(100).css("background-color","red").delay(100).fadeIn('slow',pulse);
})();​

http://jsfiddle.net/bSWMC/223/

背景の色を切り替えられないようです。ここに本当に明白な答えがあるかもしれません、私はjQueryに不慣れです！

あなたの助けに感謝します、ジェレミー

4

3 に答える 3

0

seTimeout上記で指摘した @DhirajBodicherla のようなものを使用してそれを実行する別の潜在的な方法は、.delayでは機能しません.css。jQueryは色rgbの.toggleClass

function pulse(){
    var div = $('#my_div');
    if(div.css("background-color")=="rgb(255, 0, 0)"){
        div.css("background-color","blue");
    }else{
         div.css("background-color","red");
    }
      setTimeout(pulse,100);
}

pulse();

ライブ デモ

于 2012-06-16T17:53:45.647 に答える
0

これが私がやった方法です-> http://jsfiddle.net/joplomacedo/bSWMC/229/

以下のコードを貼り付けます。

js/jquery:

(function pulse() {
   $('#my_div').css('background-color', 'red');

   setTimeout(function() {
       $('#my_div').css('background-color', 'green');
   }, 2000);

   setTimeout(function() {
       $('#my_div').css('background-color', 'blue');
   }, 4000);

   setTimeout(pulse, 6000);
})();

CSS:

#my_div {
    height:60px;
    width:60px;
    background-color:red;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}​
于 2012-06-16T18:55:32.297 に答える
0

各色に 1 つずつ 2 つの CSS クラスを作成し、jquery 関数 toggleClass を使用して、2 つの CSS クラスに名前を付けます。

$(div).toggleClass('class1 class2')

もう 1 つ、setInterval を使用して、toggleClass を実行するタイミングを設定する必要があります。このようなもの（http://jsfiddle.net/Eyq5x/31/）

<div id="me" class='yellow'></div>

div
{
    height:50px;
    width:50px;
}
.yellow
{
    background-color:yellow;

}

.red
{
    background-color:red;
}
​
$(document).ready(function(){
    setInterval(
        function(){
            $('#me').toggleClass('yellow red');
        },1000);
});​
于 2012-06-16T17:46:59.630 に答える