jQuery .css（）中的CSS box-shadow

Firefox 18似乎无法识别-moz-box-shadow或box-shadow CSS属性。

如果我使用border-color ，一切正常。

 $($this).hover( function () { //$(this).css('border-color', '#ff0'); $(this).css('box-shadow', '10px', '10px', '5px', '#888'); //$(this).css('-moz-box-shadow', '10px', '10px', '5px', '#888'); }, function () { $(this).css('border-color', ''); //$(this).css('border-width', ''); } ); 

我究竟做错了什么？

Answer 1

您需要将参数设置为一个字符串文字。 css(property name, value)函数的value参数是一个参数。

  $(this).css('box-shadow', '10px 10px 5px #888'); 

Answer 2

这个：

 $(this).css('box-shadow', '10px', '10px', '5px', '#888'); 

语法不正确。 您需要为CSS属性设置一个值：

 $(this).css('box-shadow', '10px 10px 5px #888'); 

Answer 3

需要是：

 $(this).hover(function() { $(this).css('box-shadow', '10px 10px 5px #888'); }, function() { $(this).css('border-color', ''); }); 

Answer 4

它应该是：

 $(this).css('-webkit-box-shadow', '10px 10px 5px #888'); $(this).css('-moz-box-shadow', '10px 10px 5px #888'); $(this).css('box-shadow', '10px 10px 5px #888'); 

Answer 5

适用于Safari，谷歌Chrome和Opera

 $(this).css('-webkit-box-shadow', '10px 10px 5px #888'); 

对于Mozilla Firefox使用

 $(this).css('-moz-box-shadow', '10px 10px 5px #888'); 

对于其他Web浏览器使用

 $(this).css('box-shadow', '10px 10px 5px #888');