BootStrap Carousel Slide Animation flicker

Viewed 239

In the demo of the carousel on Bootstrap, the slides are connected and clearly move "together", when I go next/prev slide, the current slide can be seen transitioning away, while the new slide transitions in.

However, when I copy pasted the sample code, my transitions are very choppy, instead of the 1st picture transitioning away, it simply disappears and the next slide transitions in, leaving this blank white space on the page everytime the carousel transitions.

How come its doing this and how do I fix it

1 Answers

There could be many issues at play here. But to show you a fully working copy to reference against, here is a JSfiddle of the carousel

<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">

https://jsfiddle.net/fatchild/j310af6n/13/

Things I would check...

  1. I have included all the relevant libraries for bootstrap to work. (see the JSFiddle)
  2. Check that the system choppy-ness isn't down to a slow system. Move your code onto something like JSFiddle and compare to mine.
  3. Shake your computer whilst screaming.
Related