내가 그러나 특정 지점에서 나는, 스택의 결합 된 애니메이션을 파괴하려는, 제작 한, 워블 애니메이션 기능이 스택

Question

재귀 함수를 작성하지만, 나는 오류가 발생 Uncaught RangeError: Maximum call stack size exceeded

이것은 전체 스택을 채우고 있기 때문에 분명하지만, 다음 애니메이션을 실행하는 더 좋은 방법이 있는지 궁금해하고 싶지만 원하는대로 멈출 수있는 부드러운 방법을 만들고 있습니까? 내가 대기열을 죽이고 애니메이션을 중지 finish()을 사용했다

function wobble(targetElement, speed, distance) { 
    targetElement.animate({ marginLeft: "+=" + distance}, { 
     complete: function() {    
      targetElement.animate({ marginLeft: "-=" + distance}, { 
       complete: function() { 
        wobble(targetElement, speed, distance, status); 
       } 
      }); 
     } 
    }); 
} 

이 내가이 오류가 발생했습니다 방법이다.

var continue=true; 
function wobble(targetElement, speed, distance) { 
    if (continue){ 
     targetElement.animate({ marginLeft: "+=" + distance}, { 
      complete: wobble (targetElement, speed, distance); 
     }); 
    } 
}; 

는 "흔들"마무리 할 // 때 (코드를 테스트하지 않고)

var count=0; 
    function wobble(targetElement, speed, distance,count) { 
     if (count < 50){ 
      targetElement.animate({ marginLeft: "+=" + distance}, { 
       complete: wobble (targetElement, speed, distance,count++); 
      } 
     } 
    }); 

두 번째 솔루션 :

Answer 1

나는 코드를 테스트하지 않은하지만 당신은 이런 식으로 뭔가를 시도 할 수 당신은 단지 설정 그래서 요점은 그쪽으로 거짓, 예를

$('button.stop').on('click',function(){ 
     console.log("wobbling stopped"); 
     continue=false; 
}); 

에 변수를 "계속"해야 t 당신은 무언가 (깃발)를 필요로합니다. 이 경우, 플래그는 "continue"변수가되어 원하는 경우 "true"에서 "false"로 변경됩니다.