Bootstrap3 カルーセルのデモはこちら

● html

  <div id="sampleCarousel" class="carousel slide" data-ride="carousel">
    <ol class="carousel-indicators">
      <li class="active" data-target="#sampleCarousel" data-slide-to="0"></li>
      <li data-target="#sampleCarousel" data-slide-to="1"></li>
      <li data-target="#sampleCarousel" data-slide-to="2"></li>
    </ol>
    <div class="carousel-inner" role="listbox">
      <div class="item active">
        <img src="./001.jpg" alt="写真1">
      </div>
      <div class="item">
        <img src="./002.jpg" alt="写真1">
      </div>
      <div class="item">
        <img src="./003.jpg" alt="写真1">
      </div>
    </div>
    <a class="left carousel-control" href="#sampleCarousel" role="button" data-slide="prev">
		<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
		<span class="sr-only">前へ</span>
	</a>
    <a class="right carousel-control" href="#sampleCarousel" role="button" data-slide="next">
		<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
		<span class="sr-only">次へ</span>
	</a>
  </div>

● JavaScript からカルーセルを操作する

  // スライドの停止
  function stop_slide() {
    jQuery('#sampleCarousel').carousel('pause');
    alert('スライドを停止しました');
  }

  // 任意の画像へ移動
  function carousel_move(no) {
    jQuery('#sampleCarousel').carousel(no);
  }