NgAnimate only partially degrades in IE9

Question

I changed the code for this tutorial , which animates the rolling one div, so that it works like a switching menu. I was hoping this would get worse in regular hide-show in IE9. What it is. But only once. If I click on the first button, it will turn its div on and off. This works for all four. But after this first switch, IE does not show again div. I can verify that it ng-clickworks by registering the index of the pressed button. For some reason, the property displaydoes not seem to be set to block. Is there a known issue where ngAnimate causes IE9 to abort without errors or did I miss something obvious?

Jsbin

Answer 1

On angularjs website you will find the following:

While most modern browsers have good support for CSS transitions and CSS animations, IE9 and earlier, no. If you want animations that are compatible with previous versions of browsers, consider using JavaScript animations, which are described in detail below.

Practically: if you delete this line: transition: all 0.8s;you will see that all browsers behave the same.

Solutions:

Internet Explorer 9 IE, , , , IE9 IE9 ( ).

<!--[if lte IE 9]>
    <script src="animation-legacy-support.js"></script>
<![endif]-->

modernizr :

if(!Modernizr.csstransitions) { // if not supported.
//ADD YOUR javascirpt-based CODE HERE
}

jquery, jquery 2.x ie9 + jquery 1.x ie6 +, .

. angular jquery ngClass JavaScript angularjs .

Answer 2

, css- IE9 . , , jQuery.

, .