jQuery animate() stop() 사용방법
jQuery로 애니메이션을 구현할 때 흔히 만나게 되는 문제가 하나 있습니다. 바로 애니메이션 큐(queue) 입니다. 예를들어, 네비게이션 메뉴에 마우스가 오면 애니메이션이 동작하게 코딩이 된 경우, 마우스를 여러번 움직였을 때, 이전 애니메이션이 멈추기 전까지 마지막 애니메이션이 동작하지 않는 현상이 바로 애니메이션 큐로 인해 발생하는 문제입니다. 이러한 문제가 일어나는 이유는 이벤트가 일어날 때마다 큐를 만들기 때문에 이들이 순차적으로 진행되면서 원하지 않는 효과가 나타납니다. See the Pen jQuery animate stop by ho (@ho) on CodePen. 위의 경우 마우스를 여러번 위아래로 움직이면 움직인 횟수만큼 바 애니메이션이 반복되는 것을 볼 수 있습니다. 반면 아래의 경..
2013년 01월 27일