Javascript 如何使用单个导航器同时导航两个旋转木马

Javascript 如何使用单个导航器同时导航两个旋转木马,javascript,jquery,twitter-bootstrap,carousel,Javascript,Jquery,Twitter Bootstrap,Carousel,在那个里,我使用了2个旋转木马,第一个是幻灯片到文本,第二个是移动框架内的导航图像,但若它将由导航器导航,那个么两者不会同时滑动 继续生活我在这里使用过引导传送带如果您有任何其他传送带用于此类型的alider,请帮助我提前感谢 $(function(){ $('.carousel-sync').on('slid.bs.carousel', function(ev) { $('.carousel-sync').removeClass('sliding');

在那个里,我使用了2个旋转木马,第一个是幻灯片到文本,第二个是移动框架内的导航图像,但若它将由导航器导航,那个么两者不会同时滑动 继续生活我在这里使用过引导传送带如果您有任何其他传送带用于此类型的alider,请帮助我提前感谢

      $(function(){
    $('.carousel-sync').on('slid.bs.carousel', function(ev) {
        $('.carousel-sync').removeClass('sliding');
    });

    $('.carousel-indicators li').on('click', function() {
      $('#myCarousel1,#myCarousel2').carousel(parseInt(this.getAttribute('data-slide-to')));
    });

    });
        <div class="col-md-6 col-sm-12 col-xs-12">
         <div id="myCarousel1" class="carousel slide carousel-sync" data-ride="carousel" data-pause="false">
         <ol class="carousel-indicators">
             <li data-slide-to="0" class="active"></li>
            <li data-slide-to="1"></li>
            <li data-slide-to="2"></li>
        </ol>
        <div class="carousel-inner">
            <div class="item active">
                <div class="carousel-caption">
                     <h1>Example headline.</h1>
                        <p>Note: If you're viewing this page via a <code>file://</code> URL, the "next" and "previous" Glyphicon buttons on the left and right might not load/display properly due to web browser security rules.</p>
                        <p><a class="btn btn-lg btn-primary" href="#" role="button">Sign up today</a></p>
        </div>
        </div>
        <a class="carousel-arrow carousel-arrow-prev" href="[id*=myCarousel]" data-slide="prev"> 
                                </a>
                                <a class="carousel-arrow carousel-arrow-next" href="[id*=myCarousel]" data-slide="next">    
                                </a>
                    </div><!-- /.carousel -->
2nd carousel from here

<div class="col-md-6 col-sm-12 col-xs-12">
                <div class="mo-holder img-responsive">
                    <div id="myCarousel2" class="carousel slide carousel-sync" data-ride="carousel" data-pause="false">     
                        <div class="carousel-inner">
                            <div class="item active">
                                <img src="images/1screen.jpg" class="img-responsive" alt="...">
                            </div>
    </div>
                        </div>
                    </div>

您可以使用以下内容:

$( document ).ready(function() {

         $('#carousel1').carousel({
         interval: 10000
     });

     $('#carousel2').carousel({
         interval: 10000
     });
});

这样,两个转盘将在幻灯片之间以10秒的间隔启动。

到底是什么问题?两个转盘在页面加载时不会同时滑动如果您将代码发布到转盘,我可以帮助您