我将不胜感激,如果任何人可以建议如何修改Twitter Bootstrap 2 carousel为了显示一组缩略图一次类似于这个jquery插件(jcarousel)
http://sorgalla.com/projects/jcarousel/examples/static_simple.html
谢谢
解决方法
目前没有支持这样的选项在Bootstrap Carousel和我不会建议你hack在脚本,因为这基本上创建一个新的,并且更新后,你可能会失去支持,但还有其他方法你可以通过使用引导程序运行的.thumbnails组来伪造这样的设置。你将只限于总是给slider容器一个宽度,或span类,像这样:
HTML
<div class="carousel slide span8" id="myCarousel"> <div class="carousel-inner"> <div class="item active"> <ul class="thumbnails"> <li class="span2"> <div class="thumbnail"> <img src="http://placehold.it/260x180" alt=""> </div> </li> <li class="span2"> <div class="thumbnail"> <img src="http://placehold.it/260x180" alt=""> </div> </li> <li class="span2"> <div class="thumbnail"> <img src="http://placehold.it/260x180" alt=""> </div> </li> <li class="span2"> <div class="thumbnail"> <img src="http://placehold.it/260x180" alt=""> </div> </li> </ul> </div> <div class="item"> <ul class="thumbnails"> <li class="span2"> <div class="thumbnail"> <img src="http://placehold.it/260x180" alt=""> </div> </li> <li class="span2"> <div class="thumbnail"> <img src="http://placehold.it/260x180" alt=""> </div> </li> <li class="span2"> <div class="thumbnail"> <img src="http://placehold.it/260x180" alt=""> </div> </li> <li class="span2"> <div class="thumbnail"> <img src="http://placehold.it/260x180" alt=""> </div> </li> </ul> </div> <div class="item"> <ul class="thumbnails"> <li class="span2"> <div class="thumbnail"> <img src="http://placehold.it/260x180" alt=""> </div> </li> <li class="span2"> <div class="thumbnail"> <img src="http://placehold.it/260x180" alt=""> </div> </li> <li class="span2"> <div class="thumbnail"> <img src="http://placehold.it/260x180" alt=""> </div> </li> <li class="span2"> <div class="thumbnail"> <img src="http://placehold.it/260x180" alt=""> </div> </li> </ul> </div> </div> <a data-slide="prev" href="#myCarousel" class="left carousel-control">‹</a> <a data-slide="next" href="#myCarousel" class="right carousel-control">›</a> </div>
正如你可以看到,在项目div中嵌套了一个缩略图组,旋转木马幻灯片,这样你可以有一组图像幻灯片,没有必要修改原来的脚本。
注意:*在旋转木马中更新了多个图片大小的演示。