javascript - IE9 : CSS msTransform:translate

标签 javascript css internet-explorer internet-explorer-9

我正在尝试缩放包含多个图像和 html map 的页面中的 div。当然我想保留元素和 html map 之间的比例。
我正在尝试使用 JQuery 设置所需的 CSS 属性。

在 Chrome 中,CSS 属性“缩放”似乎有效。图像具有绝对定位,我读到这就是此类属性在 IE 中不起作用的原因。

所以我尝试以这种方式使用 CSS 转换:

$("#div_name").css("transform"    ,"translate(" + x + "px," + y + "px)");
$("#div_name").css("transform"    ,"scale(" + zoomVal + "," + zoomVal + ")");

我也尝试过使用矩阵:

$("#div_name").css("transform","matrix( " + zoom + ", 0 , 0 , " + zoom  + " , " + x + " , " + y + " )");

这两种方法在 Firefox 和 IE10(不适用于 Chrome)中都很好用,但在 IE9 中不起作用,它只是忽略了 CSS 指令。
我尝试使用“msTransform”而不是“transform”来使用上述所有方法,但没有成功。

我得到的最好结果是同时使用“scale”和“translate”属性以及“msTransform”属性。
IE9 确实以这种方式缩放图像,但它似乎忽略了“翻译”属性。

我不明白为什么 IE9 有这种行为,我想知道一种让它工作的方法。
提前致谢。

最佳答案

检查这个:

像这样使用 -ms- 前缀:

-ms-transform

关于javascript - IE9 : CSS msTransform:translate,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17920345/

相关文章:

html - ie9 css 问题与 tbody 宽度

css - 在 IE11 中使用关键帧 + Sprite 表上的背景位置时闪烁

javascript - 检测来自外部函数的 ajax 调用结束

html - 在父文本和子文本内容之间交换文本位置

javascript - 第二次单击时 jQuery 对话框未打开

html - 2 x 2 布局中的标题

JavaScript - 警报 ("zoo">"house") 返回 true

javascript - 根据单选按钮选择添加文本( Angular )

javascript - Node.js promise 有时不会执行

css - IE7负定位问题