多平台统一管理软件接口,如何实现多平台统一管理软件接口
195
2023-06-25
Bootstrap轮播图的使用和理解4
本文实例为大家分享了Bootstrap轮播图的实现代码,供大家参考,具体内容如下
img {
width: 100%;
height: 100%;
}
p {
text-align: center;
}
轮播图1
轮播图2
轮播图3
<p>轮播图尝试
Previous
Next
$(function(){
$('.carousel').carousel({
interval: 2000,//轮播间隔
pause:"hover", //鼠标悬停在轮播图上,是否停止滚动
wrap:true, //
keyboard:true //响应键盘事件
});
$("#prev").click(function(event) {
$('.carousel').carousel('prev')// 周期上一个项目。
});
$("#next").click(function(event) {
$('.carousel').carousel('next')// 周期到下一个项目。
});;
$("#pause").click(function(event) {
$('.carousel').carousel('pause')// 从通过项目循环停止传送带。
});;
$("#start").click(function(event) {
$('.carousel').carousel('cycle')// 通过传送带项目周期从左到右。
});;
$("#jump").click(function(event) {
$('.carousel').carousel(1)// 循环传送带到一个特定的帧(0为主,类似于数组)。
});;
});
如果大家还想深入学习,可以点击这里进行学习,再为大家附3个精彩的专题:
Bootstrap学习教程
Bootstrap实战教程
Bootstrap Table使用教程
Bootstrap插件使用教程
版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。
发表评论
暂时没有评论,来抢沙发吧~