jquery - 停止 twitter 引导轮播导航以进行骑行

Question

在旋转导航中，我有 <a class="carousel-control right" href="#howToBuyCarousel" data-slide="next">&rsaquo;</a>. 如果我已经在最后一张幻灯片，我是否禁止转到下一张幻灯片。如果我在第一张幻灯片上也是如此，我想禁用向左移动到最后一张。

Answer 1

您可以通过在“幻灯片”事件处理程序中手动检查当前活动幻灯片来实现此功能

//this function gets called whenever carousel slides

$('#myCarousel').bind('slide', function(){

   var idx = $('#myCarousel .item.active').index();



   if(idx == yourCarouselLength - 1){

     //you have reached the end

     var next = $('#yourCarouselNext');

     // make your button inactive and remove any click handlers if present (pseudocode)

     next.addClass('inactive');

     //or stop automatic cycling, or however you want your carousel to behave


   }else if(idx == 0){

     //you are at the start

     var prev = $('#yourCarouselPrev');

     // make your button inactive and remove any click handlers if present (pseudocode)

     prev.addClass('inactive');

     //or stop automatic cycling, or however you want your carousel to behave

   }


});

这里'#yourCarouselPrev'和'#yourCarouselNext'是您的轮播导航按钮的 ID。