matthiasloibl.com

Bootstrap's carousel transition won't animate

September 5, 2013

Twitter Bootstrap’s carousel seems like a easy way to create a simple carousel animation on your website.

Bootstrap 3 Carousel

Because I’m using bower and grunt I decided to manually import bootstrap’s javascript.

I started by concatenating bootstrap/js/carousel.js to my remaining javascript.
Simple as that it worked after adding the css and creating the HTML.

Sadly to say the sliding transition didn’t work.

I spend almost an hour trying to figure out what was wrong in my HTML.
There wasn’t anything wrong.
The CSS was imported from bootstrap so it shouldn’t have been the problem.

Solution

While taking a look at all the available javascript files from bootstrap I saw that
there is a file called bootstrap/js/transition.js.

After concatenating this bootstrap/js/transition.js aswell as bootstrap/js/carousel.js to my javascript files, the carousel worked with the expected sliding animation.