angularjs - using animations properly in angular when ng-if -

angularjs - using animations properly in angular when ng-if -

i have simple code: (it's rendering 'pages' db)

<div ng-repeat='page in pages' > <div ng-if="$index == pagetoshow"> <h2> {{page.title}} </h2> <div ng-repeat='quest in page.quests'> <div ng-switch on="quest.ui.type"> <div ng-switch-when="ms-select-single" > <div ms-select-single quest='quest'></div> </div> <div ng-switch-when="ms-select-multy"> <div ms-select-multy quest='quest'></div> </div> <div ng-switch-when="ms-date"> <div ms-date quest='quest'></div> </div> <div ng-switch-when="ms-text"> <div ms-text quest='quest'></div> </div> <div ng-switch-when="ms-textarea"> <div ms-textarea quest='quest'></div> </div> <div ng-switch-when="ms-number"> <div ms-number quest='quest'></div> </div> <div ng-switch-when="ms-html"> <div ms-html quest='quest'></div> </div> <div ng-switch-when="ms-video"> <div ms-video quest='quest'></div> </div> <div ng-switch-when="ms-iframe"> <div ms-iframe quest='quest'></div> </div> </div> <div class="padquests"></div> </div> </div> </div>

how can simple animation, when 1 ng-if kicks in , other goes out? because had right following:

the page that's leaving bouncing out , 1 entering bouncing in fast (beneath 1 that's there moment)...

what library should utilize so?

you may interested in project called animate.css

animate.css bunch of cool, fun, , cross-browser animations utilize in projects. great emphasis, home pages, sliders, , general just-add-water-awesomeness.

angularjs animation