javascript CSS 转换在 IE 8 和 IE7 浏览器中不起作用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18633559/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS Transform not working in IE 8 and IE7 browser
提问by SivaRajini
i want to rotate a span text using css transform in IE7 and IE8 browser.
我想在 IE7 和 IE8 浏览器中使用 css 转换旋转跨度文本。
<SPAN style="FONT-SIZE: 14px; -ms-transform:rotate(-90deg); FONT-FAMILY: Segoe UI; POSITION: absolute; ZOOM: 1; COLOR: #707070; LEFT: -64px; TOP: 234px; VISIBILITY: visible">Sales Amount in millions(USD)
</SPAN>
above code will rotate the text in IE9+ and other browsers. but how can i rotate the span text that will work in IE7 and IE8 browser.
上面的代码将在 IE9+ 和其他浏览器中旋转文本。但是如何旋转可在 IE7 和 IE8 浏览器中使用的跨度文本。
filterto support older version
过滤器以支持旧版本
how can i use filter to rotate span element ?
我如何使用过滤器来旋转跨度元素?
Thanks,
谢谢,
Siva
湿婆
回答by Arunkumar
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
The rotation property of the BasicImage filter can accept one of four values: 0, 1, 2, or 3 which will rotate the element 0, 90, 180 or 270 degress respectively.
BasicImage 过滤器的旋转属性可以接受以下四个值之一:0、1、2 或 3,它们将分别将元素旋转 0、90、180 或 270 度。
回答by Behzad Hassani
Some of new attributes of css can implement with filter attribute for IE. For example If you want to have scale transform you use:
css 的一些新属性可以通过 IE 的 filter 属性来实现。例如,如果您想进行比例变换,请使用:
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
-o-transform: scale(1.05);
and etc extensions for non IE browsers. But If you Want to use this for IE 8 or older. you should do this:
等非 IE 浏览器的扩展。但是,如果您想将其用于 IE 8 或更早版本。你应该做这个:
filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.05,M12=0,M21=0,M22=1.05,SizingMethod='auto expand');
回答by syd619
You may use Matrix Filtering which is depracated from IE 9 and on. Furthermore as they mention on this link: http://msdn.microsoft.com/en-us/library/ms533014(v=vs.85).aspx
您可以使用 IE 9 及以后弃用的矩阵过滤。此外,正如他们在此链接上提到的:http: //msdn.microsoft.com/en-us/library/ms533014(v=vs.85).aspx
Resizes, rotates, or reverses the content of the object using matrix transformation.
And here is another link to make it easier for you: http://www.boogdesign.com/examples/transforms/matrix-calculator.html
这是另一个让您更轻松的链接:http: //www.boogdesign.com/examples/transforms/matrix-calculator.html
Example of 90deg rotation:
90度旋转示例:
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.00000000, M12=-1.00000000, M21=1.00000000, M22=0.00000000,sizingMethod='auto expand')";
filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.00000000, M12=-1.00000000, M21=1.00000000, M22=0.00000000,sizingMethod='auto expand');
-moz-transform: matrix(0.00000000, 1.00000000, -1.00000000, 0.00000000, 0, 0);
-webkit-transform: matrix(0.00000000, 1.00000000, -1.00000000, 0.00000000, 0, 0);
-o-transform: matrix(0.00000000, 1.00000000, -1.00000000, 0.00000000, 0, 0);