Question

如何在jquery中为css属性指定特定于浏览器的回退？

E.g。

我想做相同的事情

h1 {
  background-image: -webkit-linear-gradient(left, white, black);
  background-image: -moz-linear-gradient(left, white, black);
  background-image: -o-linear-gradient(left, white, black);
  background-image: -ms-linear-gradient(left, white, black);
}

$('h1').css({'background-image': x, 'background-image': y}) - js语法当然只允许一个＆＃39; background-image＆＃39;键。
$('h1').css('background-image', x).css('background-image', y) - jquery会覆盖第一个值。
$('h1').css('background-image', x + ',' + y) - 浏览器不喜欢它。

Answer 1

使用jQuery切换类，并在CSS中声明多个值？

Answer 2

您可以通过将CSS应用于元素然后读回值 - $('h1').css('background-image');来向浏览器询问浏览器所需的前缀。然后，您可以使用返回的值来了解设置{{{}时要使用的前缀1}}稍后。

更好的是，您可以利用jQuery的CSS挂钩来规范化对background-image的所有调用。有一套很棒的钩子here;你可能对gradients hook感兴趣。

安装挂钩后，it's as easy as:

.css

如何为特定于浏览器的css表达式做回退

2 个答案: