这个 CSS 不应该在 IE9 中工作吗？

Posted 2023-05-08

【中文标题】这个 CSS 不应该在 IE9 中工作吗？

【英文标题】：Shouldn't this CSS work in IE9?

【发布时间】：2013-07-27 04:28:07

【问题描述】：

我有一个 div，当它淡入时我正在旋转。它适用于所有现代浏览器，但 IE 的代码似乎不起作用。

#box

    width: 400px;
    height: 400px;
    display: inline-block;
    position: absolute;
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transition: all 0.8s 1s ease-in-out;
    -webkit-transition: all 0.8s 1s ease-in-out;
    -moz-transition: all 0.8s 1s ease-in-out;
    -o-transition: all 0.8s 1s ease-in-out;
    opacity:0;


#box.animate

    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    opacity:100;

我查看了以下两个类似的问题，但他们的解决方案并没有解决我的问题。

css3 rotation doesn't work in IE9

CSS3 transform: rotate; in IE9

我愿意使用 jQuery，但我对它的了解不够，无法自己编写代码。

更新

下面是我询问的关于如何使用 jQuery 解决的一个新问题的链接。如果你能帮上忙，我会给你做蛋糕。或者一个馅饼。

Rotating a div using jQuery that's supported by IE9

【问题讨论】：

有用 read - 适用于 IE9。我推荐使用JQuery transit，但是它也不支持IE9。

这篇文章将帮助你使用'-sand-transform'link你可以找到几个例子

【参考方案1】：

IE9 不支持转场，因此，它不会使用转场样式制作动画。

http://caniuse.com/#search=transition

您必须使用 javascript 或 javascript 库（jQuery 等）才能在 IE 9 中实现这一点。所以要回答您最初的问题，答案是否定的，它不应该在 IE 9 中工作。您可能想要改写并发布一个关于如何在 jquery 中进行图像旋转的新问题。

【讨论】：

说实话，我不认为它有效，但很多其他人一直说它有效。关于如何使用 jQuery 解决问题的任何想法？

【参考方案2】：

很遗憾，IE9 及更早版本不支持 CSS 属性

transition:

要创建您的处理效果，您应该使用 jQuery、Mootools 或其他类似的 javascript 库。 我知道这不是解决方案，只是提示。

【参考方案3】：

页面上的内容类型是什么？如果您没有定义内容类型，我相信 IE9 会进入“怪癖模式”。为了在 IE 中获得最佳性能，您应该将内容类型设置为以下：

【讨论】：

仍然建议您将其保留在 IE 页面中