Twitter bootstrap 推特引导转盘自动循环不工作_Twitter Bootstrap_Carousel

Twitter bootstrap 推特引导转盘自动循环不工作

twitter-bootstrap

Twitter bootstrap 推特引导转盘自动循环不工作,twitter-bootstrap,carousel,Twitter Bootstrap,Carousel,在我开始使用carousel插件之前，我一直在使用twitter引导，没有任何问题。转盘控制装置工作正常，过渡平稳，但不会自动循环！我找了很久，但找不到任何解决办法。如果有人有任何想法，请让我知道，我将非常感激 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Your Income Expert</title

在我开始使用carousel插件之前，我一直在使用twitter引导，没有任何问题。转盘控制装置工作正常，过渡平稳，但不会自动循环！我找了很久，但找不到任何解决办法。如果有人有任何想法，请让我知道，我将非常感激

    <!DOCTYPE html>
    <html lang="en">
<head>
    <meta charset="utf-8">
    <title>Your Income Expert</title>
    <link rel="stylesheet/less" type="text/css" href="less/style.less">
    <script src="js/less.js" type="text/javascript"></script>
    <script type='text/javascript' src='http://code.jquery.com/jquery-1.7.1.js'></script>
    <script src="js/bootstrap-tab.js" type="text/javascript"></script>
    <script src="js/bootstrap-carousel.js" type="text/javascript"></script>
    <script src="js/bootstrap-transition.js" type="text/javascript"></script>
</head>

<body>
    <div class="container">
        <div class="row">

            <div class="span3">
                <div class="well sidebar-nav">

                    <ul class="nav nav-list">
                        <li><h2>Your Logo Here</h2></li>
                        <li class="nav-header">Main</li>
                        <li class="active"><a href="index.html">Home</a></li>
                        <li><a href="company.html">Company</a></li>
                        <li><a href="services.html">Services</a></li>
                        <li><a href="#">Books</a></li>
                        <li><a href="#">Contact</a></li>
                        <li class="nav-header">Keep In Touch</li>
                        <li><a href="#">Facebook</a></li>
                        <li><a href="#">Twitter</a></li>
                        <li><a href="#">LinkedIn</a></li>
                        <li><a href="#">Blog</a></li>
                    </ul>
                </div><!--/.well -->
            </div><!--/span-->

            <div class="span9">
                <div class="well">

                    <div id="headerCarousel" class="carousel slide">
                        <div id="carousel-inner">
                            <div class="active item"><a href="#"><img src="broker.png" alt="" /></a></div>
                            <div class="item"><a href="#"><img src="2.png" alt="" /></a></div>
                            <div class="item"><a href="#"><img src="3.png" alt="" /></a></div>
                        </div>
                        <a class="carousel-control left" href="#headerCarousel" data-slide="prev">&lsaquo;</a>
                        <a class="carousel-control right" href="#headerCarousel" data-slide="next">&rsaquo;</a>
                    </div>

                    <ul class="nav nav-tabs">
                        <li class="active"><a data-toggle="tab" href="#home">Service 1</a></li>
                        <li><a data-toggle="tab" href="#profile">Service 2</a></li>
                        <li><a data-toggle="tab" href="#messages">Service 3</a></li>
                        <li><a data-toggle="tab" href="#settings">Service 4</a></li>
                    </ul>

                    <div class="tab-content">
                        <div class="tab-pane active" id="home">
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla laoreet neque sit amet libero pulvinar vitae consequat ante adipiscing. Nam vehicula arcu in diam vehicula pretium. Nulla volutpat tellus ut tellus consectetur blandit egestas est ullamcorper. Morbi adipiscing suscipit quam eget eleifend. Nam est turpis, blandit sed vehicula ut, aliquet quis turpis. Nulla et ligula in.</p>
                        </div>
                        <div class="tab-pane" id="profile">
                            <p>Testing the profile tab.</p>
                        </div>
                        <div class="tab-pane" id="messages">
                            <p>Testing the messages tab</p>
                        </div>
                        <div class="tab-pane" id="settings">
                            <p>Testing the settings tab.</p>
                        </div>
                    </div>

                </div>
            </div>
        </div>

    </div>
    <script>
        $('.headerCarousel').carousel({ interval: 1200 })
    </script>
</body>


你的收入专家

你的标志在这里
Main





保持联系











Lorem ipsum dolor sit amet，是一位杰出的献身者。这是一个自由的公民的生命。Nam vehicula arcu直径为vehicula pretium。这是一个很好的例子。莫比·阿迪皮斯在埃吉特·埃利芬德的家里。不，这是turpis，这是一种温和的交通工具。无叶和叶舌
测试配置文件选项卡
测试消息选项卡
测试设置选项卡
$（'.headerCarousel'）.carousel（{interval:1200}）

您在旋转木马调用中指向了错误的容器，它应该是图像容器的id，而不是类

JS已修复

参考上述答案，您还可以使用一个类。你只要把ID放进去，就好像它是一个类一样。如果你做了：

$('.carousel.slide').carousel({
    interval: 1200
});

它会工作得很好。

非常感谢！如果可以的话，我会提升你的代表，但我还没有完全做到！犯这么小的错误我觉得很傻@亚历克斯弗劳德花了我一段时间才看到，但我们大家都遇到了：）

$('.carousel.slide').carousel({
    interval: 1200
});