在轮播导航中,我有 <a class="carousel-control right" href="#howToBuyCarousel" data-slide="next">›</a>
.如果我已经在最后一张幻灯片上,请问我是否禁止转到下一张幻灯片。如果我在第一张幻灯片上也是如此,我想禁用向左转到最后一张幻灯片。
最佳答案
您可以通过在“幻灯片”事件处理程序中手动检查当前事件的幻灯片来实现此功能
//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。
关于jquery - 停止 twitter bootstrap carousel 循环导航,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18842950/