是否可以防止 Bootstrap 轮播在鼠标悬停行为时暂停并继续自动循环浏览项目?
文档仅提到
pause: "hover"
的默认行为,如果我将暂停参数更改为其他任何内容,那么轮播将完全停止工作,所以我不确定如何禁用此默认行为。
我发现
"false"
的值会导致轮播在鼠标悬停期间继续循环:
$('.carousel').carousel({
pause: "false"
});
我正在使用 Twitter Bootstrap v2.0.2
您也可以将其添加到 div .carousel 中,而不是使用 javascript。
添加延迟时间:
data-interval="3000"
添加是否在悬停时暂停,选项有
true
和 false
data-pause="false"
示例是:
<div id="carousel" class="carousel" data-ride="carousel" data-interval="3000" data-pause="false">
这对我有用。
$('.carousel').carousel({
pause: 'none'
})
适用于 Bootstrap v3.3.4
适用于 Bootstrap v5.1
data-bs-pause="false"
例如:
<div class="carousel slide" data-bs-ride="carousel" data-bs-pause="false">
Bootstrap 4 删除悬停暂停
$('.carousel').carousel({
interval: 2000,
cycle: true,
pause: "null"
})
对于仍在访问此线程的任何人,在最新版本的 4.1.3 中,请使用不带引号的 null。也许以前的 v.4 版本需要引号,但现在不是这样了:
$('.carousel').carousel({
interval: 2000,
cycle: true,
pause: null
})
在 Bootstrap 4 中:
数据暂停=“假”
例如:
<div class="carousel slide" id="carousel" data-pause="false" data-ride="carousel">
此设置可防止暂停。
我发现循环和暂停取决于两件事。
只需更改 js/bootstrap.js 文件中的以下代码行即可允许连续滑动。
.on('mouseenter', $.proxy(this.pause, this))
至
.on('mouseenter', $.proxy(this.**cycle**, this))
利用数据属性并将选项名称附加到
data-bs-
。对于这种情况,应该是data-bs-pause="false"
。
直到 bootstrap 5.0 版本:此方法工作正常。