Shouldn't this CSS work in IE9?

问题:

I have a div that I'm rotating as it fades in. It works in every modern browser, but the code for IE doesn't seem to be working.

#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;
}

I've looked at the following two similar questions, but their solutions didn't solve my problem.

css3 rotation doesn't work in IE9

CSS3 transform: rotate; in IE9

I'd be willing to use jQuery, but I don't know it well enough to code it myself.

Update

Below is a link to a new question I asked about how to solve using jQuery. If you can help I'll make you a cake. Or a pie.

Rotating a div using jQuery that's supported by IE9

回答1:

IE9 does not support transitions, therefore, it will not animate using the transition style.

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

You will have to use javascript or a javascript library (jQuery, etc) in order to achieve this in IE 9. So to answer your initial question, the answer is no, it should not work in IE 9. You might want to rephrase and post a new question on how to do image rotation in jquery however.

回答2:

Unfortunately CSS property isnt supported by IE9 and earlier

transition:

to create your dealed effect you should use jQuery, Mootools or other similar javascript library. I know that is not solution, but just hint.

回答3:

What's the content type on the page? If you're not defining a content type, I believe IE9 goes into a "quirks mode". You should set your content type to the following for the best performance in IE:

<meta http-equiv="X-UA-Compatible" content="IE=edge" />