怎样才能让与的键，当鼠标移到

Question

我尝试做一个转盘这样

LinK!

转盘具有每张幻灯片的内容按钮改变幻灯片，当u移动鼠标圆盘传送带在转盘的任何按钮上，这改变幻灯片，也有定时器来改变幻灯片。

进出口使用引导3.2.0这个是我

HTML

<div class="panel-body clearfix"> 
    <!-- LINKED NAV --> 
    <div class="col-xs-12"> 
     <ol class="carousel-linked-nav pagination"> 
      <li class=""><a href="#1">4</a></li> 
      <li class=""><a href="#2">3</a></li> 
      <li class=""><a href="#3">2</a></li> 
      <li class=""><a href="#4">1</a></li> 
     </ol> 
    </div> 
    <div id="myCarousel" class="carousel slide"> 
     <!-- Carousel items --> 
     <div class="carousel-inner"> 
      <div class="item"> 
       <a href="#"> 
        <img alt="" class=" img-responsive " src="<?= IMG . '4.jpg' ?>"> 
       </a> 
      </div> 
      <div class="item"> 
       <a href="#"> 
        <img alt="" class=" img-responsive " src="<?= IMG . '3.jpg' ?>"> 
       </a> 
      </div> 
      <div class="item"> 
       <a href="#"> 
        <img alt="" class=" img-responsive " src="<?= IMG . '2.jpg' ?>"> 
       </a> 
      </div> 
      <div class="item active"> 
       <a href="#"> 
        <img alt="" class=" img-responsive " src="<?= IMG . '1.jpg' ?>"> 
       </a> 
      </div> 
     </div> 
     <!-- Carousel nav --> 
     <a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a> 
     <a class="carousel-control right" href="#myCarousel" data-slide="next">›</a> 
    </div> 
</div> 

CSS

.carousel-indicators li{ 
    border: none; 
    background-color: #888; 
} 
.carousel-indicators li.active{ 
    border: none; 
    background-color: #4297d7; 
} 
#myCarousel { 
    margin-top: 10px; 
} 
.carousel-linked-nav, .item img { 
    display: inline; 
    margin: 0 auto; 
} 
.carousel-linked-nav { 
    width: 120px; 
    margin-bottom: 20px; 
} 

JS

function carousel() { 
    $('#myCarousel').carousel({ 
     interval: 3000 
    }); 
    $('.carousel-linked-nav > li > a').click(function() { 
     var item = Number($(this).attr('href').substring(1)); 
     $('#myCarousel').carousel(item - 1); 
     $('.carousel-linked-nav .active').removeClass('active'); 
     $(this).parent().addClass('active'); 
     return false; 
    }); 
    $('#myCarousel').bind('slid', function() { 
     $('.carousel-linked-nav .active').removeClass('active'); 
     var idx = $('#myCarousel .item.active').index(); 
     $('.carousel-linked-nav li:eq(' + idx + ')').addClass('active'); 
    }); 
} 

我试着做旋转木马一样链接，以及我不能，转盘按钮使用所有的空间，这一点，当鼠标悬停在某个按钮更改幻灯片

感谢

Answer 1

好吧，我决心在JS，加入这个

$('.carousel-linked-nav > li > a').mouseover(function() { 
     var item = Number($(this).attr('href').substring(1)); 
     $('#myCarousel').carousel(item - 1); 
     $('.carousel-linked-nav .active').removeClass('active'); 
     $(this).parent().addClass('active'); 
     return false; 
    }); 

这样的基本问题我没有是我不能使按钮使用旋转木马的所有空间。我的意思是旋转木马和空间的宽度分布在其中。