如何阻止Bootstrap传送带自动滑动? [英] How to stop Bootstrap carousel from autosliding?

问题描述

我建立了一个引导视频轮播.它工作正常，但是我唯一的问题是轮播在5秒钟后一直滑动到下一张幻灯片.如何使其停止自动滑动，仅在用户单击向左或向右箭头时才滑动?我已经粘贴了下面的代码.

I have built a bootstrap video carousel. It is working just fine but, the only problem I have is the carousel keeps sliding to the next slide after 5 seconds. How do I make it stop autosliding and only slide when the user clicks on the left or right arrows? I have pasted the code below.

    <div class="container">
        <div id="carousel-example-generic" class="carousel slide" data-ride="carousel" data-pause=hover>
            <!-- Indicators -->
            <ol class="carousel-indicators">
                <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                <li data-target="#carousel-example-generic" data-slide-to="2"></li>
            </ol>

            <!-- Wrapper for slides -->
            <div class="carousel-inner">
                <div class="item active">
                    <div class="embed-responsive embed-responsive-16by9">
                        <video class="embed-responsive-item" autoplay muted id="homevid">
                            <source src="C:\Development Software\Sample Website\videos\Michael Vick 88 yard touchdown pass to DeSean Jackson.mp4" />
                        </video>
                    </div>
                <div class="carousel-caption">

            </div>
        </div>
            <div class="item">
                <div class="embed-responsive embed-responsive-16by9">
                    <video class="embed-responsive-item" autoplay muted id="homevid">
                        <source src="C:\Development Software\Sample Website\videos\Vick to Jeremy Maclin for 50 Yard TD.mp4" />
                    </video>
                </div>

            </div>
            <div class="item">
                <div class="embed-responsive embed-responsive-16by9">
                    <video class="embed-responsive-item" autoplay muted id="homevid">
                        <source src="C:\Development Software\Sample Website\videos\Michael Vick Scramble Plays vs Rams 2011.mp4" />
                    </video>
                </div>
          </div>
    </div>

推荐答案

通过添加 data-interval ="false"

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

从文档

选项-间隔-..如果为false，则轮播不会自动循环.

Option - Interval - ..If false, carousel will not automatically cycle.

这篇关于如何阻止Bootstrap传送带自动滑动?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！