如何使用jQuery闪烁阴影？

Question

我是一个新手，我试图找出如何在元素上闪烁盒子阴影，但我不能。

到目前为止，我得到了this。

理论上，它应该工作。我在内部使用setInterval for循环，但它不起作用。另外，我想我有一些问题与切换功能。

重点是，当页面开始加载时，我希望该元素的box-shadow从非常快到非常慢开始闪烁，并最终停止。

你有什么建议吗？

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

你正在尝试做一些这样的事 - 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); 
}); 

但是，它能够更好地使用CSS3关键帧动画。