Bootstrap轮播插件简单使用方法介绍
更新时间:2016年06月21日 14:51:07 作者:-夏昊-
这篇文章主要为大家详细介绍了Bootstrap轮播插件简单使用方法,介绍了使用bootstrap轮播插件的作用,感兴趣的小伙伴们可以参考一下
本文细致的为大家分享了Bootstrap轮播插件简单实例,供大家参考,具体内容如下
使用Bootstrap的轮播插件可以向站点添加滑块,内容可以是图像,内嵌框架,视频或其它任何内容,使用轮播插件需要引入
效果图:

bootstrap.min.js.
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> <!—轮播导航 --> <ol class="carousel-indicators"> <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> <li data-target="#carousel-example-generic" data-slide-to="1"></li> <li data-target="#carousel-example-generic" data-slide-to="2"></li> </ol> <!—轮播项目 --> <div class="carousel-inner" role="listbox"> <div class="item active"> <img src="~/images/Chrysanthemum.jpg" /> <div class="carousel-caption"> ffffffff </div> </div> <div class="item"> <img src="~/images/Desert.jpg" /> <div class="carousel-caption"> xxxxxxxxxxxxxxxx </div> </div> <div class="item"> <img src="~/images/Lighthouse.jpg" /> <div class="carousel-caption"> mmmmmmmmmmmm </div> </div> </div> <!—轮播导航 --> <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left"></span> <span class="sr-only">Previous</span> </a> <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"> <span class="glyphicon glyphicon-chevron-right"></span> <span class="sr-only">Next</span> </a> </div>
小编再为大家推荐一篇文章:全面解析Bootstrap图片轮播效果
如果大家还想深入学习,可以点击这里进行学习,再为大家附一个精彩的专题:Bootstrap学习教程
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
相关文章
JavaScript中setInterval()用法举例详解
这篇文章主要给大家介绍了关于JavaScript中setInterval()用法的相关资料,setInterval()方法可按照指定的周期(以毫秒计)来调用函数或计算表达式,文中通过代码示例介绍的非常详细,需要的朋友可以参考下2023-10-10
JavaScript给input的value赋值引发的关于基本类型值和引用类型值问题
这篇文章主要介绍了JavaScript给input的value赋值引发的关于基本类型值和引用类型值问题的相关资料,需要的朋友可以参考下2015-12-12
layui动态渲染生成左侧3级菜单的方法(根据后台返回数据)
今天小编就为大家分享一篇layui动态渲染生成左侧3级菜单的方法(根据后台返回数据),具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧2019-09-09
js中编码函数:escape,encodeURI与encodeURIComponent详解
escape(), encodeURI()和encodeURIComponent()是在Javascript中用于编码字符串的三个常用的方法,而他们之间的异同却困扰了很多的Javascript初学者,这篇文章详细的给大家介绍了js中编码函数:escape,encodeURI与encodeURIComponent的相关资料,需要的朋友可以参考下。2017-03-03


最新评论