2012-12-21 3 views
0

나는 간격으로 애니메이션을 만들었습니다. 내 스크립트입니다 :자바 스크립트로 clearinterval

var count = 0; 
var countSecond = -40; 
function arrowAnimation() { 
    if (count > 40) { 
     clearInterval(); 
    } 
    $('.list-what-we-do .arrow').css({ 
     top: (count++) + 'px' 
    }); 
} 
function arrowAnimationSecond() { 
    if (countSecond > 0) { 
     clearInterval(); 
    } 
    $('.list-what-we-do .arrow').css({ 
     right: (countSecond++) + 'px' 
    }); 
} 

setInterval(arrowAnimation, 5); 
setInterval(arrowAnimationSecond, 5); 

내 질문입니다. 간격을 어떻게 멈출 수 있습니까? 나는 clearInterval을 사용했다. 그러나 그것은 작동하지 않습니다. 이 문제를 어떻게 해결할 수 있습니까? 도와 줘서 고맙다!

+1

나중에 명확한 사용하여 수있는 변수

setInterval 메서드의 반환 값을 할당해야 이를 명확한 간격에 대한 논쟁으로 사용합니다. – ryadavilli

답변

5

setInterval 또는 setTimeout을 사용하는 경우 반환 값은 참조입니다. 취소하려면이 참조를 clearInterval에 전달하십시오.

var foo = setTimeout(...); 
clearTimeout(foo); 
0

당신은 그럼 당신은 당신이 설정 한 간격의 반환 값을 캡처하지 않는 clearInterval

var count = 0; 
var countSecond = -40; 

var interval = setInterval(arrowAnimation, 5); 
var secondInterval = setInterval(arrowAnimationSecond, 5); 

function arrowAnimation() { 
    if (count > 40) { 
     clearInterval(interval); 
    } 
    $('.list-what-we-do .arrow').css({ 
     top: (count++) + 'px' 
    }); 
} 
function arrowAnimationSecond() { 
    if (countSecond > 0) { 
     clearInterval(secondInterval); 
    } 
    $('.list-what-we-do .arrow').css({ 
     right: (countSecond++) + 'px' 
    }); 
} 
관련 문제