[BootStrap]carousel

twitter bootstrapのcarouselを見ながら、実装方法について確認。

基本的には、下の構成でおｋ

<div class="container">
 <div class="row">
  <div class="span12">
   <div id="myCarousel" class="carousel slide">
    <!-- Carousel items -->
    <div class="carousel-inner">
     <div class="active item">
      <img src="" alt="">
     </div>
     <div class="item">
      <img src="" alt="">
     </div>
     <div class="item">
      <img src="" alt="">
     </div>
    </div>
    <a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a>
    <a class="carousel-control right" href="#myCarousel" data-slide="next">›</a>
   </div>
  </div>
 </div>
</div>
<script>
jQuery(function($){
 $('.carousel').carousel();
});
</script>

myCarouselのところは、任意に変更しても問題ない。

ただ、ちょっとやっかいなのは、IE8、IE7だと、スライドしてくれないこと。

もし、IEでもスライドさせたい場合は、別途、プラグインを作る必要があるのかなと。