Este js faz toda parte de next,prev e auto do meu slide, mas há um "porém": quando eu clico em prev, ele volta e depois avança na mesma ação.
O que tem de errado na lógica deste script?
JS:
$(document).ready( function() {
$('#myCarousel').carousel({
interval: 4000
});
var clickEvent = false;
$('#myCarousel').on('click', '.nav a', function() {
clickEvent = true;
$('.nav li').removeClass('active');
$(this).parent().addClass('active');
}).on('slid.bs.carousel', function(e) {
if(!clickEvent) {
var count = $('.nav').children().length -1;
var current = $('.nav li.active');
current.removeClass('active').next().addClass('active');
var id = parseInt(current.data('slide-to'));
if(count == id) {
$('.nav li').first().addClass('active');
}
}
clickEvent = false;
});
$(document).ready(function(){
$(".prev-slide").click(function(){
var count = $('.nav').children().length -1;
var current = $('.nav li.active');
current.removeClass('active').prev().addClass('active');
var id = parseInt(current.data('slide-to'));
});
});
});
HTML:
<ul class="nav nav-pills nav-justified">
<li data-target="#myCarousel" data-slide-to="0" class="active"><a href="#">INTERCAMBIO</a></li>
<li data-target="#myCarousel" data-slide-to="1"><a href="#">AÉREO</a></li>
<li data-target="#myCarousel" data-slide-to="2"><a href="#">PHENOMENAL</a></li>
<li data-target="#myCarousel" data-slide-to="3"><a href="#">CURSOS</a></li>
</ul>
carousel
que estás a usar? não tem métodos para fazer mudar as imagens sem teres de fazer à mão?