'use strict';
$(function(){
var width = 720;
var animationSpeed = 1000;
var pause = 3000;
var currentSlide = 1;
var $slider = $('#slider');
var $slideContainer = $slider.find('.slides');
var $slides = $slideContainer.find('.slide');
var $slidesleft = $slideContainer.find('.left');
var $slidesright = $slideContainer.find('.right');
var interval;
function startSlider(){
interval = setInterval(function(){
$slideContainer.animate({'margin-left': '-='+width}, animationSpeed,function(){
currentSlide++;
if (currentSlide === $slides.length) {
currentSlide = 1;
$slideContainer.css('margin-left', 0);
}
});
},pause);
}
function stopSlider(){
clearInterval(interval);
};
$('#slidebttn').on('mouseenter', stopSlider).on('mouseleave', startSlider);
startSlider();
$('#slidebttn .right').on('click', function (){
$slideContainer.animate({'margin-left': '-='+width}, animationSpeed,function(){
currentSlide++;
if (currentSlide === $slides.length) {
currentSlide = 1;
$slideContainer.css('margin-left', 0);
}
});
} );
$('#slidebttn .left').on('click', function (){
$slideContainer.animate({'margin-left': '+='+width}, animationSpeed,function(){
currentSlide--;
if (currentSlide === 0) {
currentSlide = $slides.length;
$slideContainer.css('margin-left', 720);
}
});
} );
});
Ok here is my code I am working with. Everything works fine until I try and slide my slider to the left. It will not repeat back to the right position. As of right now the slide right button works just fine with no problems but it refuses to slide left. Any reason I it might not be sliding left appropriately?
Aucun commentaire:
Enregistrer un commentaire