Skip to main content
added 151 characters in body
Source Link
XciD
  • 2.6k
  • 19
  • 43

Change default class ngAnimate in order to use Using ng-animate with animate.css

I'm trying to understand and use ngAnimate.

I'm using angular-animate.js, animate.css and angular 1.3.

Right now I understood that, I should justI've add on my app conf ngAnimate to activate it and after just customizeI've add to my css something like that  :

.ng-leave{ //-webkit-animation-name: somefadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: cssfadeInUp; animation-name: fadeInUp; } 

NowIt's working because, I'd like to know if therefadeInUp is a way to not writing css.

For exemple, I have animateddeclare in animate.css, when a item appear I just want to use fadeInUp and when it leave, nothing...

Like I saidSo, now I would like to do the same thing without writing css (by juste using animate.css)

for exemple :I've tried something like that, but it's not working

<li class="list animated cars" ng-repeat="item in cars track by item.id" ng-appear='fadeInUp'>animate="{enter: 'fadeInUp animated', leave: 'fadeOutUp animated'}"> 

I'm maybe not clear, tell me I would try to improve ;)Any idea ?

Thanks

Change default class ngAnimate in order to use animate.css

I'm trying to understand and use ngAnimate.

Right now I understood that, I should just add on my app ngAnimate to activate it and after just customize my css like that:

.ng-leave{ // some animation css } 

Now, I'd like to know if there is a way to not writing css.

For exemple, I have animated.css, when a item appear I just want to use fadeInUp and when it leave, nothing...

Like I said, without writing css.

for exemple :

<li class="list animated cars" ng-repeat="item in cars track by item.id" ng-appear='fadeInUp'> 

I'm maybe not clear, tell me I would try to improve ;)

Thanks

Using ng-animate with animate.css

I'm trying to understand and use ngAnimate.

I'm using angular-animate.js, animate.css and angular 1.3.

Right now, I've add on my app conf ngAnimate to activate it and I've add to my css something like that  :

.ng-leave{ -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp; } 

It's working because, fadeInUp is declare in animate.css.

So, now I would like to do the same thing without writing css (by juste using animate.css)

I've tried something like that, but it's not working

<li class="list cars" ng-repeat="item in cars track by item.id" ng-animate="{enter: 'fadeInUp animated', leave: 'fadeOutUp animated'}"> 

Any idea ?

Thanks

Source Link
XciD
  • 2.6k
  • 19
  • 43

Change default class ngAnimate in order to use animate.css

I'm trying to understand and use ngAnimate.

Right now I understood that, I should just add on my app ngAnimate to activate it and after just customize my css like that:

.ng-leave{ // some animation css } 

Now, I'd like to know if there is a way to not writing css.

For exemple, I have animated.css, when a item appear I just want to use fadeInUp and when it leave, nothing...

Like I said, without writing css.

for exemple :

<li class="list animated cars" ng-repeat="item in cars track by item.id" ng-appear='fadeInUp'> 

I'm maybe not clear, tell me I would try to improve ;)

Thanks