在模态发射时暂停旋转木马(自举)

时间:2014-03-26 19:23:56

标签: javascript jquery twitter-bootstrap

寻找一些简单干净的代码来编写。当我启动模态时,我希望幻灯片暂停。我在按钮类和类中有模态触发器。我尝试过这样的事情,我知道这是错的,有什么想法吗?谢谢。

 <script type="text/javascript">

  $('.modal').on('shown.bs.modal', function (e) {
  $('.carousel').pause('slide.bs.carousel');
 })


</script>

轮播代码

 <div class="row">
    <div class="carousel-container">
      <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
      <!--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>
        <li data-target="#carousel-example-generic" data-slide-to="3"></li>
        <li data-target="#carousel-example-generic" data-slide-to="4"></li>
        <li data-target="#carousel-example-generic" data-slide-to="5"></li>
      </ol>
      <!--Wrapper for Slides-->
      <div class="carousel-inner">
        <div class="item active" id="slide_1"></div>

        <div class="item" id="slide_2"></div>

        <div class="item" id="slide_3"></div>

        <div class="item" id="slide_4"></div>

        <div class="item" id="slide_5"></div>

        <div class="item" id="slide_6"></div>
      </div>
      </div>
   </div>
</div>

1 个答案:

答案 0 :(得分:2)

根据Bootstrap's documentation,要暂停转盘,您必须使用.carousel('pause')

所以试试这个:

$('.modal').on('shown.bs.modal', function (e) {
    $('.carousel').carousel('pause');
})