화살표를 클릭하지 않는 한이 이미지 슬라이더 회전식 컨베이어에서 모든 애니메이션을 중지하는 방법은 무엇입니까?

Question

은 회전 목마는 무엇 사이트 소유자가하고 싶어하는 사람이 녹색 화살표를 클릭하지 않는 이상 여전히 이미지 슬라이더 숙박을하고, 그것은 한 번만 이동합니다 http://www.indicatorwarehouse.com/index-3-27-11.html

에 있습니다. 또는 그는 매우 느리게, 아마도 5 분마다 한 번 미끄러지기를 원합니다. 이 슬라이더의 코드는 아래에 있습니다 ...이 코드가 의미하는 바를 전혀 모릅니다. js와 함께하는 초보자입니다. 고마워요! :)

$(document).ready(function(){ 
    $('#sliderGallery').Slider(); 
}); 

(function($){ 
$.fn.Slider = function(params){ 
    var defaults = { 
     moveLeft: true, 
     onItem: false, 
     isAnimating: false, 
     timer: null 
    }, 
    intialize = function(id){ 

///////////////////////////////////////////////////////////// 
/////  Bind Hover Events on Left & Right Buttons  ///// 
///////////////////////////////////////////////////////////// 
     $('div#leftButton').hover(function(){ 
      $(this).addClass('leftImageHov'); 
      clearInterval(defaults.timer); 
     },function(){ 
      $(this).removeClass('leftImageHov'); 
      setTimer(); 
     }); 
     $('div#rightButton').hover(function(){ 
      $(this).addClass('rightImageHov'); 
      clearInterval(defaults.timer); 
     },function(){ 
      $(this).removeClass('rightImageHov'); 
      setTimer(); 
     }); 

///////////////////////////////////////////////////////////// 
/////   Stop Animation on Hovering Items   ///// 
///////////////////////////////////////////////////////////// 
     $('#canvas ul li').hover(function(){ 
      clearInterval(defaults.timer); 
     },function(){ 
      setTimer(); 
     }); 

///////////////////////////////////////////////////////////// 
/////  Get Size of the #Canvas ul & Set It  ///// 
///////////////////////////////////////////////////////////// 
     var li = $('#canvas ul li'); 
     var liWidth = li.eq(0).width(); 
     var liCount = li.length; 
     $('#canvas ul').css({width: liWidth*liCount + 'px', left: '0px'}); 

///////////////////////////////////////////////////////////// 
///// Bind Click Event on the Left & Right Buttons ///// 
///////////////////////////////////////////////////////////// 
     var leftLimit = (liWidth*liCount) - $('div#canvas').width(); 
     $('div#leftButton').click(function(){ 
      if(!defaults.isAnimating) 
       Animate(liWidth, 600, leftLimit); 
     }); 
     $('div#rightButton').click(function(){ 
      if(!defaults.isAnimating) 
       Animate((-1*liWidth), 600, leftLimit); 
     }); 

     setTimer(); 
    }, 
    setTimer = function(){ 
     defaults.timer = setInterval(doAnimation, 30000);  
    }, 
    Animate = function(amount, time, leftLimit){ 
     defaults.isAnimating = true; 
     var leftVal = $('div#canvas ul').css('left'); 
     leftVal = leftVal.replace('px',''); 
     leftVal = leftVal*1; 
     amount += leftVal; 

///////////////////////////////////////////////////////////// 
/////     Range Check     ///// 
///////////////////////////////////////////////////////////// 
     if(amount < (-1*leftLimit)) { amount = (-1*leftLimit); defaults.moveLeft = false; } 
     if(amount > 0) { amount = 0; defaults.moveLeft = true; } 

     $('div#canvas ul').animate({ 
      left: amount 
     }, time, function() { defaults.isAnimating=false; }); 
    }, 

///////////////////////////////////////////////////////////// 
/////      Animation      ///// 
///////////////////////////////////////////////////////////// 
    doAnimation = function(){ 
     var li = $('#canvas ul li'); 
     var liWidth = li.eq(0).width(); 
     var liCount = li.length; 
     var leftLimit = (liWidth*liCount) - $('div#canvas').width(); 
     var animValue = liWidth*3; 
     if(defaults.moveLeft) animValue *= -1; 
     else animValue = leftLimit; 
     Animate(animValue, 0, leftLimit); 
    } 

    return this.each(function(){ 
     intialize(this); 
    }); 
} 
})(jQuery); 

Answer 1

애니메이션 슬라이드를 설정하기 위해 매 5 분으로 변경 :

setTimer = function(){ 
     defaults.timer = setInterval(doAnimation, 30000);  
    }, 

setTimer = function(){ 
     defaults.timer = setInterval(doAnimation, 150000);  
    }, 

Answer 2

하나를 슬라이딩 한 시도하여이를 변경할 :

var leftLimit = (liWidth*liCount) - $('div#canvas').width(); 
     $('div#leftButton').click(function(){ 
      if(!defaults.isAnimating) 
       Animate(liWidth, 600, leftLimit); 
     }); 
     $('div#rightButton').click(function(){ 
      if(!defaults.isAnimating) 
       Animate((-1*liWidth), 600, leftLimit); 
     }); 

함께 :

작동

var leftLimit = (liWidth*liCount) - $('div#canvas').width(); 
     $('div#leftButton').click(function(){ 
      if(!defaults.isAnimating) 
       Animate(liWidth, 100, leftLimit); 
     }); 
     $('div#rightButton').click(function(){ 
      if(!defaults.isAnimating) 
       Animate((-1*liWidth), 100, leftLimit); 
     }); 

Answer 3

carousel.stop(true) 

..이 시도 한 번