Bootstrap Carousel

Bootstrap Carousel

by panchroma

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css">
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js"></script>

    <div class="container">
        <div id="myCarousel" class="carousel slide">
            <!-- Carousel items -->
            <div class="carousel-inner">
            <div class="active item"><img src="https://dl.dropbox.com/u/2665617/tamatea-car.jpg" alt="Wedge Tire"></div>
            <div class="item"><img src="https://dl.dropbox.com/u/2665617/tamatea-car.jpg" alt="Wedge Tire"></div>
            <div class="item"><img src="https://dl.dropbox.com/u/2665617/tamatea-car.jpg" alt="Wedge Tire"></div>
            <div class="item"><img src="https://dl.dropbox.com/u/2665617/tamatea-car.jpg" alt="Wedge Tire"></div>
            <div class="item"><img src="https://dl.dropbox.com/u/2665617/tamatea-car.jpg" alt="Wedge Tire"></div>
            <div class="item"><img src="https://dl.dropbox.com/u/2665617/tamatea-car.jpg" alt="Wedge Tire"></div>
            <div class="item"><img src="https://dl.dropbox.com/u/2665617/tamatea-car.jpg" alt="Wedge Tire"></div>
            <div class="item"><img src="https://dl.dropbox.com/u/2665617/tamatea-car.jpg" alt="Wedge Tire"></div>
            <div class="item"><img src="https://dl.dropbox.com/u/2665617/tamatea-car.jpg" alt="Wedge Tire"></div>
        </div>
        <!-- Carousel nav -->
        <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
        <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
    </div>

JavaScript

$(document).ready(function(){
        $('.carousel').carousel({
          interval: 3000
        });
    });