bootstrap 轮播craousel 采坑之(修改默认鼠标浮动轮播不停止)
首先上bootstrap 官网 https://v3.bootcss.com/javascript/#carousel
设置这个参数就可以,后面说如何采坑。见代码
html 部分
<!-- 轮播one -->
<div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="2500">
<!-- 轮播(Carousel)项目 -->
<div class="carousel-inner bxwz">
<div class="item active bannerone-slide ">
<div class="container banner_position">
<h2>TOP-TIER IT CARE WITH</h2>
<h2>1/5 OF SILLICAN-VALLEY-COST</h2>
<h4>WE OFFERS GREAT SERVICE AT EVEN GREATER RATES</h4>
<div><span>ARCHITECT</span><span>PROJECT MANAGER</span><span>ENGINEER</span></div>
</div>
</div>
<div class="item bannertwo-slide">
<div class="container banner_position">
<h2>ONE STOP. FROM LISTENING TO YOU,</h2>
<h2>TO DEPLOYMENT/MAINTENANCE</h2>
<div><span>ENGINEER</span><span>DESIGNER</span><span>NETWCRKMANAGEMENT</span>
<span>MATHEMATICIAN</span></div>
</div>
</div>
<div class="item bannerthree-slide">
<div class="container banner_position">
<h2>YES WE EVEN DO</h2>
<h2>DATA MODELLING</h2>
<h4>WE OFFERS GREAT SERVICE AT EVEN GREATER RATES</h4>
<div><span>ARCHITECT</span><span>PROJECT MANAGER</span><span>ENGINEER</span></div>
</div>
</div>
<!-- 轮播(Carousel)指标 -->
<ol class="carousel-indicators" data-ride="carousel" data-interval="1000">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
</div>
<a class="carousel-control left" href="#myCarousel" data-slide="prev"></a>
<a class="carousel-control right" href="#myCarousel" data-slide="next"></a>
</div>
js部分
$('#myCarousel').carousel({
interval: 2500,
pause: null,
wrap:true
});
这样设置是不对的,出不来效果,鼠标悬浮上去还是会轮播,
解决办法:必须修改HTML部分中第一行
<div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="2500">
修改为
<div id="myCarousel" class="carousel slide" >
这个样子就ok了
bootstrap 轮播craousel 采坑之(修改默认鼠标浮动轮播不停止)的更多相关文章
- Cloudera Manager 5.9 和 CDH 5.9 离线安装指南及个人采坑填坑记
公司的CDH早就装好了,一直想自己装一个玩玩,最近组了台电脑,笔记本就淘汰下来了,加上之前的,一共3台,就在X宝上买了CPU和内存升级了下笔记本,就自己组了个集群. 话说,好想去捡垃圾,捡台8核16线 ...
- Hadoop环境搭建--Docker完全分布式部署Hadoop环境(菜鸟采坑吐血整理)
系统:Centos 7,内核版本3.10 本文介绍如何从0利用Docker搭建Hadoop环境,制作的镜像文件已经分享,也可以直接使用制作好的镜像文件. 一.宿主机准备工作 0.宿主机(Centos7 ...
- Spring Cloud Config采坑记
1. Spring Cloud Config采坑记 1.1. 问题 在本地运行没问题,本地客户端服务能连上本地服务端服务,可一旦上线,发现本地连不上线上的服务 服务端添加security登录加密,客户 ...
- rabbitmq在ios中实战采坑
1. rabbitmq在ios中实战采坑 1.1. 问题 ios使用rabbitmq连接,没过多久就断开,并报错.且用android做相同的步骤并不会报错,错误如下 Received connecti ...
- 从源码看Spring Security之采坑笔记(Spring Boot篇)
一:唠嗑 鼓捣了两天的Spring Security,踩了不少坑.如果你在学Spring Security,恰好又是使用的Spring Boot,那么给我点个赞吧!这篇博客将会让你了解Spring S ...
- Charles 抓包工具安装和采坑记录
Charles 抓包工具安装和采坑记录 网络抓包是解决网络问题的第一步,也是网络分析的基础.网络出现问题,第一步肯定是通过抓包工具进行路径分析,看哪一步出现异常.做网络爬虫,第一步就是通过抓包工具对目 ...
- alert大法看执行流程(一次采坑)
页面的dom元素加载完了,给元素一次性添加事件. 收获:事件都是一次性给添加好的,不是点击一次,................................................... ...
- tk.mybatis通用工具采坑记
tk.mybatis通用工具pom <!--mybatis依赖--> <dependency> <groupId>org.mybatis.spring.boot&l ...
- python+selenium自动化登录dnf11周年活动界面领取奖励登录部分采坑总结[1]
背景: Dnf的周年庆活动之一,游戏在6月22日 06:00~6月23日 06:00之间登陆过游戏后可以于6月25日 16:00~7月04日 06:00领取奖励 目标:连续四天自动运行脚本,自动领取所 ...
随机推荐
- CNN如何识别一幅图像中的物体
让我们对卷积神经网络如何工作形成更好直观感受.我们先看下人怎样识别图片,然后再看 CNNs 如何用一个近似的方法来识别图片. 比如说,我们想把下面这张图片识别为金毛巡回犬. 一个需要被识别为金毛巡 ...
- 微博第三方登录时,域名使用错误报错, Laravel \ Socialite \ Two \ InvalidStateException No message
使用微博第三方登录时,报错 Laravel \ Socialite \ Two \ InvalidStateException No message Laravel \Socialite \Two \ ...
- AtCoder Beginner Contest 078 D ABS
光做C了,做完C,就要结束了,看了看D,没看懂那操作啥意思,就扔了. 刚才看了看,突然懂了.. 就是每个人从那堆牌上边拿牌,最少拿一张,最多可以全拿走,然后手里留下最后一张拿到的,其余的都扔掉. 比如 ...
- @hdu - 6372@ sacul
目录 @description@ @solution@ @accepted code@ @details@ @description@ 定义矩阵 \(A_i\) 是一个大小为 \(p^i*p^i\) ...
- poj 3862 && LA 4589 Asteroids (三维凸包+多面体重心)
3862 -- Asteroids ACM-ICPC Live Archive 用给出的点求出凸包的重心,并求出重心到多边形表面的最近距离. 代码如下: #include <cstdio> ...
- hdu 1156 && poj 2464 Brownie Points II (BIT)
2464 -- Brownie Points II Problem - 1156 hdu分类线段树的题.题意是,给出一堆点的位置,stan和ollie玩游戏,stan通过其中一个点画垂线,ollie通 ...
- PHP导入导出Excel方法小结
基本上导出的文件分为两种: 1:类Excel格式,这个其实不是传统意义上的Excel文件,只是因为Excel的兼容能力强,能够正确打开而已.修改这种文件后再保存,通常会提示你是否要转换成Excel文件 ...
- supersocket Silverlight 策略服务器
<?xml version="1.0"?> <configuration> <configSections> <section name= ...
- windows下检出项目和提交项目
1.git status:查看工作区的状态 2.git add 文件名:建立跟踪 3.git commit:提交变更 4.git push:发布本地操作 5.解决 The requested UR ...
- js读取cookie 根据cookie名称获取值、赋值
借鉴:原作者https://blog.csdn.net/zouxuhang/article/details/80548417 //方法1 //存在问题:如果cookie中存在 aaaname= ...