2013-08-03 2 views
0

사용자가 중단하지 않으면 애니메이션이 끝날 때까지 애니메이션 시퀀스가 ​​있습니다. 애니메이션은 지연을 사용하여 구현됩니다. 예를사용자 상호 작용으로 애니메이션 시퀀스 중단

$element1.delay(1000).animate({left: 1000}, 5000); 
$element2.delay(2000).animate({left: 1000}, 5000); 
$element3.delay(3000).animate({left: 1000}, 5000); 
$element4.delay(4000).animate({left: 1000}, 5000); 

를 들어 내가 이런 식으로하고있어 그 이유는 각각의 애니메이션이 다른 사람의 타이밍에서 완전히 독립적이기 때문에이 나에게 직관적 인 것 때문이다.

2500ms 마크에서 애니메이션을 중단하고 중단되면 요소가 애니메이션 상태의 끝으로 이동해야한다고 가정합니다. 이제 .find (: animated) 선택 항목에서 .stop (false, true) 함수를 사용하려고했습니다. $ element1과 $ element2는 실제로 중단되고 끝 상태로 건너 뜁니다. 그러나 $ element3과 $ element4는 아직 지연 단계에 있기 때문에 영향을받지 않습니다.

내가 원하는 효과를 얻으려면 가장 좋고 간단한 방법은 무엇일까요? 감사합니다

답변

0

나는 최근에 도입 된 finish() 방법을 찾고 있다고 생각합니다. stop()의 jumpToEnd 인수를 true로 설정하면 대기열에있는 현재 처리 된 항목에만 영향을 미칩니다. 그러나 finish()으로 전화하면 전체 대기열의 최종 결과로 이동합니다.

바이올린 : http://jsfiddle.net/SnTgS/

Finish()가 jQuery를 1.9에서 도입,하지만 나중에 1.10.1에서 수정 된 몇 가지 버그를했다, 그래서 당신은 해당 버전 및 최신을 사용할 수 있습니다했다. jQuery를 이전 버전의

http://api.jquery.com/finish/

나는 당신이 루프 큐 길이를 통과한다 수와 큐의 각 항목에 stop(false, true) 전화 가정합니다.

관련 문제