CODEWITHSUNDEEP
animationionic2
Geo Tsa
Geo Tsa

Reputation: 13

Ionic 2 animation does not play on every slide

I am building a presentation in IONIC 2 using the slides. In every slide I use animations to present the data (title slide in, graphs fade in etc). My problem is that the animation works only in the first slide. When I swipe to the rest no animation plays.

Below is a sample of my code 

<ion-slides>
  <ion-slide>
    <div class="slideContent slideBacBlack">
        <div class="slide0Verbs">
            <div class="slide0descr animated fadeIn"><img src="images/ola-0-descr.png"></div>
            <div class="slide0Title"><img src="images/ola-0-title.png"></div>
        </div>
        <div class="slide0Photo animated fadeIn"><img src="images/ola-0-img.png"></div> 
    </div>
  </ion-slide>
</ion-slides>

Any help is much appreciated!

Upvotes: 0

Views: 204

Answers (1)

yash_DedSec
yash_DedSec

Reputation: 251

Okay, So the problem is as soon as you are opening your slides view every slide in there gets animated at the same time.. So you need something that only triggers animation when that particular part comes into the viewport. For this you can use your normal javascript or use something called as css3-animate-it. http://jackonthe.net/css3animateit/

Upvotes: 0

Related Questions