停止Twitter自举旋转木马导航骑自行车

Question

在carousal nav中，我有<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。