#79: Complete/Non-Queuing Animations with jQuery

Avatar of Chris Coyier
Chris Coyier on (Updated on )

Grow sales with Customer Journey Smarts with MailChimp Mailchimp tracking pixel

Download Video
(Only MVP Supporters can download original high-quality recordings for offline viewing.)

When you use jQuery’s .animate() function with something like a hover event, those animations will “queue up”. That is, if you hover multiple times, that animation will fire multiple times. The classic method to prevent this is to throw in a .stop() before the animation, but I find this abrupt and not ideal, because it prevents the animation from completing a full cycle. In this screencast we’ll look at a few attempts at solving this and ultimately using a plugin that does a great job.

Links from Video: