如何使用供应商前缀修改jquery的jquery？

我想改变一个jQuery UI的滑块，与供应商前缀的背景CSS。我正在使用线性渐变。我最需要所有浏览器的支持。我已经在css样式表中设置了一些带有供应商前缀的css，并且我想通过javascript更改渐变。我需要的CSS这个前缀5如何使用供应商前缀修改jquery的jquery？

-webkit-
-moz-
-O-
-ms-

-khtml-

这里是jsfiddle

$(function() { 
    $("#range-slider1").slider({ 
     range:false, 
     min: 0, 
     max: 360, 
     value: 0, 
     slide: function(event, ui) { 
     var hue = ui.value, 
      sat = $('#range-slider2').slider('value'), 
      light = $('#range-slider3').slider('value'), 
      alpha = $('#range-slider4').slider('value'), 
      hsla = "hsla(" + hue + "," + sat + "%, " + light + "%, " + alpha + ")", 
     satRangeW = "-webkit-linear-gradient(left, hsla(" + ui.value + ", 0%, 50%, 1),hsla(" + ui.value + ", 20%, 50%, 1),hsla(" + ui.value + ", 40%, 50%, 1),hsla(" + ui.value + ", 60%, 50%, 1),hsla(" + ui.value + ", 80%, 50%, 1),hsla(" + ui.value + ", 100%, 50%, 1))", 
     satRangeMo = "-moz-linear-gradient(left, hsla(" + ui.value + ", 0%, 50%, 1),hsla(" + ui.value + ", 20%, 50%, 1),hsla(" + ui.value + ", 40%, 50%, 1),hsla(" + ui.value + ", 60%, 50%, 1),hsla(" + ui.value + ", 80%, 50%, 1),hsla(" + ui.value + ", 100%, 50%, 1))"; 
     $("#slidevalue").text(hsla); 
     $(".slidevalue").css('background-color', hsla); 
     $("#range-slider2").css("background", satRangeW); 

     } 
    }); 

    $("#range-slider2").slider({ 
     range:false, 
     min: 0, 
     max: 100, 
     value: 100, 
     slide: function(event, ui) { 
      var hue = $('#range-slider1').slider('value'), 
       sat = ui.value, 
       light = $('#range-slider3').slider('value'), 
       alpha = $('#range-slider4').slider('value'), 
       hsla = "hsla(" + hue + "," + sat + "%, " + light + "%, " + alpha + ")"; 
      $("#slidevalue").text(hsla); 
      $(".slidevalue").css('background-color', hsla); 

     } 
    }); 
    $("#range-slider3").slider({ 
     range:false, 
     min: 0, 
     max: 100, 
     value: 50, 
     slide: function(event, ui) { 
      var hue = $('#range-slider1').slider('value'), 
       sat = $('#range-slider2').slider('value'), 
       light = ui.value, 
       alpha = $('#range-slider4').slider('value'), 
       hsla = "hsla(" + hue + "," + sat + "%, " + light + "%, " + alpha + ")"; 
      $("#slidevalue").text(hsla); 
      $(".slidevalue").css('background-color', hsla); 

     } 
    }); 
    $("#range-slider4").slider({ 
     range:false, 
     min: 0, 
     max: 1, 
     value: 1, 
     step: 0.01, 
     slide: function(event, ui) { 
      var hue = $('#range-slider1').slider('value'), 
       sat = $('#range-slider2').slider('value'), 
       light = $('#range-slider3').slider('value'), 
       alpha = ui.value, 
       hsla = "hsla(" + hue + "," + sat + "%, " + light + "%, " + alpha + ")"; 
      $("#slidevalue").text(hsla); 
      $(".slidevalue").css('background-color', hsla); 

     } 
    }); 
});

来源

2016-03-14 Shohidul Alam

http://stackoverflow.com/questions/17487716/does-css-automatically-add-vendor-prefixes/17487728（卖主前缀添加用'的CSS（）'） – Shanimal

我看到了这个问题。没有任何插件可以吗？ –

'.css'是jquery的一部分，我不明白？ – Shanimal

您已经展示了如何通过jQuery修改CSS，例如代码：

$(".slidevalue").css('background-color', hsla);

你会使用相同的语法，只是提供CSS属性作为第一个参数和值作为第二。例如：

$(".slidevalue").css('-webkit-border-radius', "5px");

来源

2016-03-14 07:04:18

我正在使用线性渐变。 –

没关系。只需使用-webkit-linear-gradient-即可。无论您需要哪种CSS属性，只需在第一个参数中将其作为字符串提供即可。 –

如何使用供应商前缀修改jquery的jquery？

回答

相关问题