Spicing Up the Bootstrap Carousel with CSS3 Animations

Hi magtechpro, thank you so much for your comment!

As I understand your requirements, you need to attach two types of animation to the captions, one on the next slide as it become visible and one on the previous slide as it gets hidden.

The Animate.css library should have the right animation types for you to choose from.

You’ll need to add some mods to the doAnimations() function. At the top of my head, you don’t need to grab the animation types from the data attributes in your HTML because you already have two specific animation types that you want to implement on the way in and on the way out. So, add two variables to store the different animation types.

Next, you’ll need to target both the current panel and the previous panel with respect to the current one so that you can attach one type of animation to the captions located in the current panel and another type of animation to the captions located in the previous panel. If you’re OK targeting elements with jQuery you could have a go at experimenting with the code yourself. I haven’t tried it myself, but I might as soon as I get some free time.

Cheers :slight_smile: