var activeSlide = 1; var moveRight = true; var dontSlide = false; var dotPressed = false; var slideSpeed = 600; var imgCount = ; $(document).ready(function(){ }); function slide(){ if(dotPressed){ $( "#mobSlideFrame" ).stop().animate({ "margin-left": -sliderWidth*(activeSlide-1) }, slideSpeed, function() { }); if(moveRight){ if(activeSlide >= 3) moveRight = false; }else{ if(activeSlide <= 1) moveRight = true; } }else{ if(moveRight){ $( "#mobSlideFrame" ).stop().animate({ "margin-left": -sliderWidth*activeSlide }, slideSpeed, function() { }); activeSlide++; if(activeSlide >= imgCount) moveRight = false; }else{ $( "#mobSlideFrame" ).stop().animate({ "margin-left": -sliderWidth*(activeSlide-2) }, slideSpeed, function() { }); activeSlide--; if(activeSlide <= 1) moveRight = true; } } dotAppearence(); } //Dot appearence function dotAppearence(){ $(".dot-a").addClass("dot-i").removeClass("dot-a"); $("#dot"+activeSlide).addClass("dot-a").removeClass("dot-i"); } //Dot clicked function dotClicked(dotId){ if(dotId > activeSlide){ moveRight = true; }else if(dotId < activeSlide){ moveRight = false; } activeSlide = dotId; dotPressed = true; slide(); dotPressed = false; dontSlide = true; } //Left right swipes $(function(){ // Bind the swiperightHandler callback function to the swipe event on div.box $( "#mobSlide" ).on( "swipeleft", swipeleftHandler ); $( "#mobSlide" ).on( "swiperight", swiperightHandler ); function swipeleftHandler( event ){ if(activeSlide < imgCount){ moveRight = true; slide(); } dontSlide = true; } function swiperightHandler( event ){ if(activeSlide > 1){ moveRight = false; slide(); } dontSlide = true; } });