jquery - 使用 jQuery 更新多个后台 CSS 定义

Question

有人能想出一种方法来一次更新多个背景定义吗？

我已经完成了一些代码，但我想为一个元素更新许多不同风格的渐变背景。

$('ul#tabs li').on('mousemove',function(e){ 
var x= Math.round(((e.pageX - this.offsetLeft)*100)/$(this).width());
x= x-10;
$(this).find(".highLight").css({
    'background': '-webkit-linear-gradient(left, 
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,0.5)'+x+'%,
        rgba(255,255,255,0) 100%)'
});});

如有任何想法，我们将不胜感激。

Answer 1

您可以使用 http://lea.verou.me/prefixfree/

A script that lets you use only unprefixed CSS properties everywhere. It works behind the scenes, adding the current browser’s prefix to any CSS code, only when it’s needed.

..

Lets jQuery’s .css() method to get and set unprefixed properties (requires plugin)

或者，您可以为每个浏览器的渐变语法调用.css():

var $highLight = $(this).find(".highLight");
$highLight.css('background', '-webkit-linear-gradient( .. )');
$highLight.css('background', '-moz-linear-gradient( .. )');
//include others such as opera, old webkit, microsoft
$highLight.css('background', 'linear-gradient( .. )');

仅应用每个浏览器支持的渐变语法。