如何在 Opera 浏览器中旋转 div答案

【问题标题】：How to rotate a div in opera browser如何在 Opera 浏览器中旋转 div
【发布时间】：2013-04-21 00:10:43
【问题描述】：

我想在低于 10.50 的版本中将 div 旋转 20 度下面是我用于旋转 div 的 Javascript 代码：

<script type="text/javascript">
    function rotator(value) {
        document.getElementById('divId').style.webkitTransform = "rotate(" + value + "deg)";
        document.getElementById('divId').style.msTransform = "rotate(" + value + "deg)";
        document.getElementById('divId').style.MozTransform = "rotate(" + value + "deg)";
        document.getElementById('divId').style.OTransform = "rotate(" + value + "deg)";
        document.getElementById('divId').style.transform = "rotate(" + value + "deg)";
        document.getElementById('span1').innerHTML = value + " deg";
    }
</script>

HTML 代码：

    <body>
    <div id="divId" style="height: 150px; width: 150px background-color:red; border: 1px solid #000;">
        This is Rotator Div
    </div>
    <br />
    Rotate:
    <input type="range" min="-360" max="360" value="0" onchange="rotator(this.value)" /><br />
    Rotate Div in <span id="span1">Zero deg</span>
</body>

我该如何解决我的问题？

【问题讨论】：

“解决我的问题。”不。准确解释你的问题是什么，然后我可能会。大概<div> 根本没有旋转，但是当你不说的时候，怎么会有人知道呢？
基本上我想在较低版本的opera中旋转图像。
“解决我的问题”——命令我们做某事不会有任何好处。

标签： javascript css html rotator

【解决方案1】：

Opera 10.5 以下的版本不支持 CSS 旋转变换，这就是为什么你的这个 JavaScript 方法不起作用的原因。

请参阅：http://caniuse.com/#feat=transforms2d

您可以做的是在 Photoshop 中旋转您的图像，然后上传具有透明背景的图像，但是图像当然是静态的，我怀疑这就是您想要的。

【讨论】：

+1，虽然你会认为 OP 可以在 Google 上花费 10 秒并自己解决这个问题，呵呵;P