防止在页面加载时自动滑动 Bootstrap 旋转木马

小开

实际上，这个问题现在已经解决了，我在方法“ carousel”中添加了“ stop”参数，如下所示:

$(document).ready(function() {
$('.carousel').carousel('pause');
});

无论如何，非常感谢@Yohn 对这个解决方案的建议。

小开

解决了前/后按钮后旋转木马自动滑动的问题。

$('.carousel').carousel({
pause: true,
interval: false
});

小开

最佳答案

或者，如果您正在使用 Bootstrap 3.0，那么您可以停止循环，例如使用 data-time = “ false”

<div id="carousel-example-generic" class="carousel slide" data-interval="false">

Other helpful carousel data attributes are here -> http://getbootstrap.com/javascript/#carousel-usage

小开

如果您在 carousel 的 HTML 结构上使用 引导程序3 set data-interval="false"

例如:

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel" data-interval="false">

小开

--Use data-interval="false" to stop automatic slide ——使用 data-wraps = “ false”停止圆形幻灯片

...

小开

小开

把这个加到你的菜单里:

data-interval="false"

小开

下面是 bootstrap carousel 的参数列表。像 Interval，暂停，包装:

For more details refer this link:

希望这个能帮到你:)

Note: This is for further help. I mean how you can customise or change default behaviour once carousel is loaded.

小开

我想也许你应该去检查官方说明关于旋转木马，对我来说，我没有找到答案以上，因为多个版本的引导程序，我正在使用 b4-alpha 和 我要自动播放效果停止。

$(document).ready({
pause:true,
interval:false
});

当鼠标离开该页面时，该脚本不会产生任何效果，确切地说是旋转木马区域。进入官方定义，找到以下内容:

因此，您将找到为什么。如果 carousel page onmouseover 事件被触发，页面将暂停，而鼠标离开该页面时，页面将再次恢复。

因此，如果您希望永远停止页面并手动旋转 ，只需设置 data-interval='false'即可。

小开

For Bootstrap 4 simply remove the 'data-ride="carousel"' from the carousel div. This removes auto play at load time.

要再次启用自动播放，仍然需要使用 javascript 中的“ play”调用。

小开

启动5.2，只需删除 data-bs-ride

Take note that data-bs-interval="false" from Bootstrap 5.0 has been deprecated on Bootstrap 5.2

引导程序5.0，添加 data-bs-interval="false"