如何使用JavaScript动态设置样式-webkit-transform？

我想-webkit-transform: rotate()动态地使用JavaScript 更改属性,但常用的setAttribute不起作用:

img.setAttribute('-webkit-transform', 'rotate(60deg)');

这.style也不起作用......

如何在JavaScript中动态设置它？

1> Ólafur Waage..：

---

JavaScript样式名称是WebkitTransformOrigin和WebkitTransform

element.style.webkitTransform = "rotate(-2deg)";

在此处检查WebKit的DOM扩展参考.

---

如果你想要多于一个,请用空格分隔例如:`element.style.webkitTransform ="rotate(-2deg)translateX(100px)";`

---

MozTransform应该是你的朋友.

2> Armel Larcie..：

---

以下是大多数常见供应商的JavaScript表示法:

webkitProperty
MozProperty
msProperty
OProperty
property

我重置内联变换样式,如:

element.style.webkitTransform = "";
element.style.MozTransform = "";
element.style.msTransform = "";
element.style.OTransform = "";
element.style.transform = "";

像这样使用jQuery:

$(element).css({
    "webkitTransform":"",
    "MozTransform":"",
    "msTransform":"",
    "OTransform":"",
    "transform":""
});

请参阅博客文章使用JavaScript编码供应商前缀(2012-03-21).

---

jQuery自动选择正确的前缀,只需编写`transform`.

3> Andrei Serde..：

---

尝试使用

img.style.webkitTransform = "rotate(60deg)"