Bootstrap4のCarouselが動かない
環境
- IntelliJ IDEA 2016.2.1
- Bootstrap v4.0.0-alpha.4 ←IDEAで適当にインポートしたら4だった
症状
- Bootstrap http://getbootstrap.com/ のExampleの通りでCarousel*1が動かない
結論
Bootstrap3までは'class="item"'だったが、Bootstrap4では'class="carousel-item"'に名前が変わっている。
おかしいおかしいと思いながら bootstrap.js を見たら上記の通りだった。
Bootstrap3 Example
<!-- Wrapper for slides --> <div class="carousel-inner" role="listbox"> <div class="item active"> <!-- こことか --> <img src="..." alt="..."> </div> <div class="item"> <!-- こことか --> <img src="..." alt="..."> </div> </div>
Bootstrap4 Example
<!-- Wrapper for slides --> <div class="carousel-inner" role="listbox"> <div class="carousel-item active"> <!-- こことか --> <img src="..." alt="..."> </div> <div class="carousel-item"> <!-- こことか --> <img src="..." alt="..."> </div> </div>
今回の教訓、ソースコードが見れるんだから、ぐぐってばかりじゃなくてソースコードを読まないと。
リハビリだからとのらりくらりやってた自分が悪い。どうもすみませんでした。
*1:カルーセル。画像をスライドショー風にくるくる回してくれるJavaScript