Javascript 是否可以防止 Bootstrap 轮播在鼠标悬停时暂停并继续自动循环?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10267934/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is it possible to prevent the Bootstrap carousel pause on mouse hover and continue automatically cycling?
提问by Andy Bowskill
Is it possible to prevent the Bootstrap carousel pause on mouse hover behaviour and continue automatically cycling through the items instead?
是否可以防止 Bootstrap 轮播暂停鼠标悬停行为并继续自动循环浏览项目?
The documentation only mentions the default behaviour of pause: "hover", if I change the pause argument to anything else then the carousel stops working altogether so I'm not sure how to disable this default behaviour.
该文档仅提及 的默认行为pause: "hover",如果我将 pause 参数更改为其他任何内容,则轮播将完全停止工作,因此我不确定如何禁用此默认行为。
回答by xcer
I've found that a value of "false"will cause the carousel to keep cycling during a mouseover:
我发现值"false"将导致轮播在鼠标悬停期间保持循环:
$('.carousel').carousel({
pause: "false"
});
I am using Twitter Bootstrap v2.0.2
我正在使用 Twitter Bootstrap v2.0.2
回答by JCBrown
You can add this to the div .carousel too instead of using javascript.
您也可以将其添加到 div .carousel 而不是使用 javascript。
Add delay time:
添加延迟时间:
data-interval="3000"
data-interval="3000"
Add if it pauses on hover or not, options are trueand false
添加是否在悬停时暂停,选项是true和false
data-pause="false"
data-pause="false"
Example would be:
示例是:
<div id="carousel" class="carousel" data-ride="carousel" data-interval="3000" data-pause="false">
<div id="carousel" class="carousel" data-ride="carousel" data-interval="3000" data-pause="false">
This worked for me.
这对我有用。
回答by wpdevramki
$('.carousel').carousel({
pause: 'none'
})
for Bootstrap v3.3.4
Bootstrap v3.3.4
回答by Abdul Razak
Bootstrap 4 Remove Pause on hover
Bootstrap 4 在悬停时删除暂停
$('.carousel').carousel({
interval: 2000,
cycle: true,
pause: "null"
})
回答by Nicholas Rotondo
For anyone still visiting this thread, in the most recent version of 4.1.3, use nullwithout quotations. Maybe quotes were required in previous v.4 versions, but not the case now:
对于仍在访问此线程的任何人,在 4.1.3 的最新版本中,请使用不带引号的null。也许在以前的 v.4 版本中需要引用,但现在不是这样:
$('.carousel').carousel({
interval: 2000,
cycle: true,
pause: null
})
回答by Yogesh Chaudhari
I have found that there are 2 things on which this cycling and pausing depends.
我发现这种循环和暂停取决于两件事。
- When mouse enters (mouseenter - pause sliding)
- When mouse leaves (mouseleave - resume sliding)
- 当鼠标进入时(mouseenter - 暂停滑动)
- 当鼠标离开时(mouseleave - 恢复滑动)
Just change following line of code in your js/bootstrap.js file to allow continuous sliding.
只需更改 js/bootstrap.js 文件中的以下代码行即可允许连续滑动。
.on('mouseenter', $.proxy(this.pause, this))to
.on('mouseenter', $.proxy(this.pause, this))到
.on('mouseenter', $.proxy(this.**cycle**, this))
.on('mouseenter', $.proxy(this.**cycle**, this))

