jQueryを使って影を揺らす方法は？

Question

私は初心者ですが、私はどのように要素の上にボックスシャドウをつけているのか把握しようとしていましたが、できませんでした。

これまでのところ、私はthisを得ました。

理論的には、動作するはずです。 forループの内側にsetIntervalを使用しましたが、動作しませんでした。また、私はトグル機能にいくつかの問題があると思う。

主なポイントは、ページの読み込みが開始されたら、その要素のボックスシャドウが非常に速くて非常に遅く始まり、最終的には停止するようにしたいということです。

ご意見はありますか？

Answer 1

私はPraveen Vijayanに同意します。ここではCSS3のキーフレームとのショーケースである：http://jsfiddle.net/ufP7h/

@-webkit-keyframes twinkly { 
    0% { box-shadow: 0 0 10px #6c9; } 
    100% { box-shadow: 0 0 10px red; } 
} 
@-moz-keyframes twinkly { 
    0% { box-shadow: 0 0 10px #6c9; } 
    100% { box-shadow: 0 0 10px red; } 
} 
@-ms-keyframes twinkly { 
    0% { box-shadow: 0 0 10px #6c9; } 
    100% { box-shadow: 0 0 10px red; } 
} 

#twinkle { 
    -webkit-animation: twinkly 1s alternate infinite; 
    -moz-animation: twinkly 1s alternate infinite; 
    -ms-animation: twinkly 1s alternate infinite; 
} 

Answer 2

次のようないくつかのことやろうとしている - CSS3キーフレームアニメーションを使用するようにhttp://jsbin.com/eceziw/4

$(function() { 
    var x = 0; 
    function twinkle() { 
    if(x){ 
     $('#twinkle').addClass('shadowAnim'); 
     x =0; 
    }else{ 
     $('#twinkle').removeClass('shadowAnim'); 
     x=1; 
    }       
} 
    setInterval(twinkle, 1000); 
}); 

をしかし、そのより良いです。