首先上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 采坑之(修改默认鼠标浮动轮播不停止)的更多相关文章

  1. Cloudera Manager 5.9 和 CDH 5.9 离线安装指南及个人采坑填坑记

    公司的CDH早就装好了,一直想自己装一个玩玩,最近组了台电脑,笔记本就淘汰下来了,加上之前的,一共3台,就在X宝上买了CPU和内存升级了下笔记本,就自己组了个集群. 话说,好想去捡垃圾,捡台8核16线 ...

  2. Hadoop环境搭建--Docker完全分布式部署Hadoop环境(菜鸟采坑吐血整理)

    系统:Centos 7,内核版本3.10 本文介绍如何从0利用Docker搭建Hadoop环境,制作的镜像文件已经分享,也可以直接使用制作好的镜像文件. 一.宿主机准备工作 0.宿主机(Centos7 ...

  3. Spring Cloud Config采坑记

    1. Spring Cloud Config采坑记 1.1. 问题 在本地运行没问题,本地客户端服务能连上本地服务端服务,可一旦上线,发现本地连不上线上的服务 服务端添加security登录加密,客户 ...

  4. rabbitmq在ios中实战采坑

    1. rabbitmq在ios中实战采坑 1.1. 问题 ios使用rabbitmq连接,没过多久就断开,并报错.且用android做相同的步骤并不会报错,错误如下 Received connecti ...

  5. 从源码看Spring Security之采坑笔记(Spring Boot篇)

    一:唠嗑 鼓捣了两天的Spring Security,踩了不少坑.如果你在学Spring Security,恰好又是使用的Spring Boot,那么给我点个赞吧!这篇博客将会让你了解Spring S ...

  6. Charles 抓包工具安装和采坑记录

    Charles 抓包工具安装和采坑记录 网络抓包是解决网络问题的第一步,也是网络分析的基础.网络出现问题,第一步肯定是通过抓包工具进行路径分析,看哪一步出现异常.做网络爬虫,第一步就是通过抓包工具对目 ...

  7. alert大法看执行流程(一次采坑)

    页面的dom元素加载完了,给元素一次性添加事件. 收获:事件都是一次性给添加好的,不是点击一次,................................................... ...

  8. tk.mybatis通用工具采坑记

    tk.mybatis通用工具pom <!--mybatis依赖--> <dependency> <groupId>org.mybatis.spring.boot&l ...

  9. python+selenium自动化登录dnf11周年活动界面领取奖励登录部分采坑总结[1]

    背景: Dnf的周年庆活动之一,游戏在6月22日 06:00~6月23日 06:00之间登陆过游戏后可以于6月25日 16:00~7月04日 06:00领取奖励 目标:连续四天自动运行脚本,自动领取所 ...

随机推荐

  1. Jmeter If控制器

    "${xxx}"=="1" 或者 "${xxx}"!="2"

  2. @codeforces - 1205D@ Almost All

    目录 @description@ @solution@ @accepted code@ @details@ @description@ 给定一个 n 个点的无向树. 请在每条边上写上权值,使得对于每一 ...

  3. vue element 给指数的div加loading

     const loading = this.$loading({       lock: true,       text: 'Loading',       spinner: 'el-icon-lo ...

  4. 在线url网址编码、解码

    >>在线url网址编码.解码<<

  5. jquery实现单击div切换背景

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. 【原生JS】写最简单的图片轮播

    非常简单的一个大图轮播,通过将控制显示位置来进行轮播效果,写来给正在学习的新手朋友们参考交流. 先看效果:(实际效果没有这么快) 先看布局: <div id="display" ...

  7. js键盘按下移动元素

    文章地址 https://www.cnblogs.com/sandraryan/ 功能: 点击上下左右按钮,移动元素 <!DOCTYPE html> <html lang=" ...

  8. 洛谷P1449 后缀表达式 题解 栈

    题目链接:https://www.luogu.org/problem/P1449 这道题目我们只需要开一个栈,每次读取到一个数的话就将这个数 push 进栈. 因为提供给我们的时候已经是一个后续序列了 ...

  9. pytorch中如何处理RNN输入变长序列padding

    一.为什么RNN需要处理变长输入 假设我们有情感分析的例子,对每句话进行一个感情级别的分类,主体流程大概是下图所示: 思路比较简单,但是当我们进行batch个训练数据一起计算的时候,我们会遇到多个训练 ...

  10. gradle 生成 pom,引用mybatis-plus源代码到自己的工程中

    一 前情概要 自己的maven工程使用mybatis-plus,然后想用热部署加载mapping文件.经过各种探索之后实现了,但是修改了xml文件后,就不断在控制台提示“mapper xxx is i ...