[Jquery] 특정 엘리먼트에 대한 Queue 모두 제거하기

만약 특정 엘리먼트에 Hover 했을때 그 엘리먼트에 animate 효과를 주려 한다. Hover 했을때 1초동안 Animate 가 지속된다 하면, 애니메이션이 동작하고 있는 1초동안 다시 Hover 이벤트가 발생해도 바로 애니메이션이 동작하지 않고, 큐의 형식으로 프로세스가 뒤에 차곡차곡 쌓여있어 1초동안 4번 Hover 해도 애니메이션은 충실히 4초동안 작동한다. 애니메이션이 동작하기 전에 해당 엘리먼트의 작동되고 있는 (그리고 작동될) 애니메이션등의 큐를 모두 제거하게 되면, 롤에서 평타 캔슬하듯이 작업을 캔슬할 수 있다.

$(element).clearQueue();

clearQueue() 해주면, 해당 엘리먼트에 쌓인 모든 큐를 제거해준다.

non

claerQueue() 미적용

 

 

nonon

 

claerQueue() 적용

You may also like...