Bootstrap Carousel不会自动滑动 [英] Bootstrap Carousel Not Automatically Sliding

问题描述

我正在使用Twitter的旋转木马（最新版本）的引导程序，我已经开始工作了 - 除了它没有开始自动滑动。单击其中一个导航按钮后，它可以正常工作。不知道为什么会这样做。

I'm using bootstrap by Twitter's carousel (latest version) and I've got it working - except that it doesn't begin to automatically slide. It works well after you've clicked one of the navigation buttons . Not sure why it's doing this.

这是标题中我的JS设置：

Here's my JS setup in the header:

    <script type="text/javascript" src="<?php echo tz_JS . '/bootstrap/jquery.js'; ?>"></script>

<script type="text/javascript" src="<?php echo tz_JS . '/bootstrap/bootstrap-carousel.js'; ?>"></script>
<script type="text/javascript" src="<?php echo tz_JS . '/bootstrap/bootstrap-transition.js'; ?>"></script>

HTML：

<div id="myCarousel" class="carousel slide">
<div class="carousel-inner">

    <div class="active item">
    <div class="image-position-right">
        <a href="#"><img src="validimagelink.jpg" width="920" height="550" alt=""></a>
    </div>
    </div>


    <div class="item">
    <div class="image-position-right">
        <a href="#"><img src="validimagelink.jpg" width="920" height="550" alt=""></a>
    </div>
    </div>

</div>

<a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">›</a>

也只是添加这个无济于事：

Also just added this to no avail:

<script>
$('#myCarousel').carousel({
    interval: 1200
});
</script>

进行上述更改后，javascript控制台会说：

After making the above change, the javascript console says:

Uncaught TypeError：Object＃没有方法'carousel'
（匿名函数）
b.extend.ready jquery.min.js：29
u

Uncaught TypeError: Object # has no method 'carousel' (anonymous function) b.extend.ready jquery.min.js:29 u

有关为什么这不起作用的任何想法？

Any thoughts on why this wouldn't be working?

推荐答案

<script type="text/javascript">
  $(document).ready(function() {
    $('.carousel').carousel({
      interval: 1200
    })
  });
</script>

如果仍然无效，请在浏览器中查找潜在错误（firebug / chrome ..）控制台。

If it still is not working, look for potential errors in the browser's (firebug/chrome..) console.

Uncaught TypeError: Object # has no method 'carousel' (anonymous function) b.extend.ready jquery.min.js:29 u

确保：

只包含一个jQuery

Only one jQuery is included

只有一个包含bootstrap-carousel.js或bootstrap.js。

Only one bootstrap-carousel.js or bootstrap.js is included.

首先包含jQuery，然后是bootstrap-carousel.js或bootstrap.js，然后是$（document）.ready （...

jQuery is included first, then bootstrap-carousel.js or bootstrap.js, then $(document).ready( ...

这篇关于Bootstrap Carousel不会自动滑动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！