Bootstrap搭建传送带
2016-04-27 11:28
369 查看
http://getbootstrap.com/javascript/#carousel
进度指示器
进度指示器的data-target属性必须使用传送带的ID homepage-featureJS插件为传送带添加active类。
然后是显示前一个后一个的按钮
如此便好了。
进度指示器
<div id="homepage-feature" class="carousel slide"> <ol class="carousel-indicators"> <li data-target="#homepage-feature" data-slide-to="0" class="active"></li> <li data-target="#homepage-feature" data-slide-to="1" ></li> <li data-target="#homepage-feature" data-slide-to="2" ></li> <li data-target="#homepage-feature" data-slide-to="3" ></li> </ol>
进度指示器的data-target属性必须使用传送带的ID homepage-featureJS插件为传送带添加active类。
<div class="carousel-inner"> <div class="item active"> <img > </div> <div class="item "> <img > </div> ... </div>
然后是显示前一个后一个的按钮
<a class="left carousel-control" href="#homepage-feature" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left"></span> </a> <a class="right carousel-control" href="#homepage-feature" data-slide="next"> <span class="glyphicon glyphicon-chevron-left"></span> </a></div>
如此便好了。
相关文章推荐
- Bootstrap(七) Bootstrap支持的JavaScript插件
- Bootstrap(六) 其它内置组件
- Bootstrap(五) 导航条、分页导航
- Bootstrap(四) 菜单、按钮及导航
- bootstrap模版
- Bootstrap(三) 网格系统
- Bootstrap(二) 表单
- bootstrap validator html attributes 选项
- BootStrap响应式导航条
- Bootstrap(一) 排版
- 简介BootStrap model弹出框的使用
- Java全新高大尚HTML5 bootstrap后台框架源码 java图片爬虫 自定义表单
- bootstrap样式大全
- Bootstrap学习速查表(二) 排版及表格
- JS组件Bootstrap实现弹出框效果代码
- Bootstrap滚动监听(Scrollspy)插件详解
- JS组件Bootstrap实现下拉菜单效果代码
- 关于Bootstrap日期控件datetimepicker被模态框等遮罩在底部的问题及解决办法。
- Bootstrap每天必学之模态框(Modal)插件
- Bootstrap表单组件教程详解