Javascript 使用jquery设置所有css3背景图像

您好，我想为所有使用jquery的浏览器设置

背景图像

：

background-image:linear-gradient(green, blue); /* Norme W3C */
background-image:-moz-linear-gradient(green, blue); /* Firefox */
background-image:-webkit-gradient(linear, green, blue); /* Chrome, Safari */
background-image:-o-linear-gradient(green, blue); /* Opera */
background-image:-ms-linear-gradient(green, blue); /* IE */

我是这样设置的：

$（“#”+elmt）.css（“背景图像”、“线性渐变”（+hex+）、“+$（'#test2'）.val（）+”）

仅适用于W3C，但可在firefox上使用，但不能在Chrome上使用

如何设置所有这些设置？

自动CSS前缀：当您在.CSS（）或.animate（）中使用CSS属性时，我们将为该浏览器使用正确的前缀属性（适当时）。例如，以.css（“用户选择”、“无”）；在Chrome/Safari中，我们将该值设置为“-webkit user select”，Firefox将使用“-moz user select”，IE10将使用“-ms user select”

升级至最新版本，应自动处理此问题

编辑

这应该是自动工作的，以下应该在jQuery 1.8中实现：

var cssPrefixString = {};
var cssPrefix = function(propertie) {
    if (cssPrefixString[propertie] || cssPrefixString[propertie] === '') return cssPrefixString[propertie] + propertie;
    var e = document.createElement('div');
    var prefixes = ['', 'Moz', 'Webkit', 'O', 'ms', 'Khtml']; // Various supports...
    for (var i in prefixes) {
        if (typeof e.style[prefixes[i] + propertie] !== 'undefined') {
            cssPrefixString[propertie] = prefixes[i];
            return prefixes[i] + propertie;
        }
    }
    return false;
};

用法

var cssTransform = cssPrefix('Transform'); // "MozTransform" or "WebkitTransform"
if (cssTransform ) {
    var cssProp = {};
    cssProp['border'] = '1px solid rgba(0, 0, 0, .5)';
    cssProp[cssPrefix('Transform')] = 'rotate(20deg)';
    cssProp[cssPrefix('borderRadius')] = '5px'; // Keep the camelCaze (jQuery like)
    cssProp[cssPrefix('boxShadow')] = '2px 2px 6px grey';
    $('div#myDiv').css(cssProp);
    // console.log(cssProp);
}


因此，这两种方法中的一种应该适合您。
您可以只使用-前缀自由：

它会动态地将供应商前缀添加到CSS中。
我相信您会发现这个答案很有用。我不太确定。它们在css属性名称前加前缀，但你确定它们对值也加前缀吗？@iMoses也许——我是根据它们所做的陈述做出假设的，这本身就是一个缺陷。我添加了完全支持自动前缀的代码，它应该在jQuery1.8中存在。跟随小提琴并检查元素，或者取消注释
//console.log（）
行，这应该可以工作，不是吗？