Twitter Bootstrap Carousel autoplay on load

Simple. You're missing the "data-ride" attribute in the div.

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


you should do as the Twitter Bootstrap Documentation says about Carousel, so set the first Carousel slide item with class="active" and initialize the js for the carousel in this way:

$(function(){
    $('.carousel').carousel({
      interval: 2000
    });
});

then if it's not enough (but this never happened to me) use the bruteforce triggering the click hover the carousel control buttons like this:

$(function(){
$('.carousel').carousel({
      interval: 2000
    });
$('.carousel-control.right').trigger('click');
});

but this is just a not-needed trick, really, just follow the documentantion!


As per the docs, you need to initialize the Carousel plugin via JavaScript. The carousel example on the official Bootstrap documentation page is initialized in the application.js file on lines 67-68:

// carousel demo
$('#myCarousel').carousel()

which gives it the default settings.

If you want to specify the cycle interval, you can set the interval property in milliseconds:

$('.carousel').carousel({
  interval: 2000
})