Ng-Animate doesn't work with Chrome

Question

I have some compatibility problems between Chrome and Firefox. I use ng-view to create an animation (with ng-ng-enter and leave). Here is an example with a plunker:

http://plnkr.co/edit/Vo2cJ72DO0a5aSCipkvg?p=preview

style.css

 .view.ng-leave, .view.ng-enter{ -webkit-animation-duration: 0.5s; -moz-animation-duration: 0.5s; -ms-animation-duration: 0.5s; -o-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -ms-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; } .view.ng-leave { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; -ms-animation-name: fadeOut; -o-animation-name: fadeOut; animation-name: fadeOut; } .view.ng-enter { -webkit-animation-name: fadeIn; -moz-animation-name: fadeIn; -ms-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; }

When I execute the plunker Firefox, no problems, I have an animation. But when I execute in Chrome, I did not work, but I'm prefix -webkit-

What is the problem ?

Vinay K · Accepted Answer · 2015-03-11 17:55:40Z

<ng-view> is a HTMLUnknownElement.

Seems like animations doesn't work with HTMLUnknownElements in chrome.

Changing <ng-view> to <div ng-view> worked for me.

Plnkr: http://plnkr.co/edit/DT5xcxgficbdu8CaFTlT?p=preview

It also doesn't work even if you register the element name ^^ Some chrome bug.

Collectives™ on Stack Overflow

Ng-Animate doesn't work with Chrome

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related