Question

我有以下bootstrap 3轮播：

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel" data-interval="false">
<!-- Indicators -->
<ol class="carousel-indicators">
  <span style="margin-left: -7px;px;color:#C0BEBE;font-size: 25px;" data-target="#carousel-example-generic" data-slide-to="0" class="active">
    <span class="fa-stack fa-lg">
      <i class="fa fa-circle-thin fa-stack-2x"></i>
      1
    </span>
  </span>
  <span style="margin-left: -7px;px;color:#C0BEBE;font-size: 25px;" data-target="#carousel-example-generic" data-slide-to="1">
    <span class="fa-stack fa-lg">
      <i class="fa fa-circle-thin fa-stack-2x"></i>
      2
    </span>
  </span>
  <span style="margin-left: -7px;px;color:#C0BEBE;font-size: 25px;"  data-target="#carousel-example-generic" data-slide-to="2">
    <span class="fa-stack fa-lg">
      <i class="fa fa-circle-thin fa-stack-2x"></i>
      3
    </span>
  </span>
  <span style="margin-left: -7px;px;color:#C0BEBE;font-size: 25px;"  data-target="#carousel-example-generic" data-slide-to="3">
    <span class="fa-stack fa-lg">
      <i class="fa fa-circle-thin fa-stack-2x"></i>
      4
    </span>
  </span>
  <!-- <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" role="listbox">
  <div class="item active">

    <div class="carousel-caption">
      ...
    </div>
  </div>
  <div class="item">

    <div class="carousel-caption">
      ...
    </div>
  </div>
  <div class="item">

    <div class="carousel-caption">
      ...
    </div>
  </div>
  <div class="item">

    <div class="carousel-caption">
      ...
    </div>
  </div>
</div>

正如你所看到的，我有data-interval =＆＃34; false＆＃34;但我的旋转木马总是自动滑动，我只想在用户按下编号为1,2,3 o 4的按钮时更换幻灯片，但我可以让它停止。

我也试试：

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

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

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

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

我检查了我的webinspector，我没有任何javascript错误。

Answer 1

你的标记错了

从标记中删除data-ride="carousel"

使用data-interval =＆＃34; false＆＃34;防止Twitter引导程序轮播自动滑动不起作用

1 个答案: