jQuery Hover with Animate: Animations Not Stopping Correctly

Back in my Flash days, animations seemed to just work.  I am finding that jQuery hover and animate events are not as forgiving.

I have a web page with a grid of images.  Each image has a jQuery hover event.  The issue I was having with this is that when I would quickly hover from image-to-image or swipe the cursor across the screen, the hover effects, collectively, would look weird and sometimes would not fire properly at all.

The solution (thanks to Tom for providing it!), was to add the stop(true,true) event to each animation as follows:

// jQuery
$('.myclass').hover(function(){
$(this).stop(true, true).animate({opacity: 0}, 150);
}, function(){
$(this).stop(true, true).animate({opacity: .8}, 150);
});

Additional Source

Posted in

The Mighty Mo! Design Co.

RSS From Toby’s Blog

  • Where uncertainty exists, don’t order specific.
    4 Idiot Case Studies with 2 simple age-old business lessons. The post Where uncertainty exists, don’t order specific. appeared first on Toby Cryns, WordPress Trainer in Minneapolis, MN.
  • “Now THAT was a good meeting!”
    A single effective meeting can change the course of history for a company. Imagine if you could lead effective meetings EVERY DAY! You can, but it takes curiosity & practice. This article is a good place to start your journey to a more effective you. The post “Now THAT was a good meeting!” appeared first […]
  • Never Respond to RFPs & Custom Proposal Requests
    Y'all who work at normal 9-5 jobs don't need to deal with the B.S. that is an RFP process (or rather you get paid to deal with it). But us freelancers gotta deal with a whole big bag of schtuff when it comes to custom proposals. Here's my quick-and-dirty RFP filtering process that I use […]

More posts from themightymo.com

How to auto-save Advanced Custom Fields (ACF) data to a file in your theme

By The Mighty Mo! Design Co. | January 24, 2023

With ACF 5, they shipped a relatively-unknown and awesome feature: The ability to have WordPress automatically-save your ACF fields to a json file in your theme folder every time you save your fields. This has the effect of: All you need to do is add a folder called, “acf-json”, to your theme folder, and it…

How to use $current_user or is_user_logged_in() with FacetWP and WordPress to show different content for logged-in users

By The Mighty Mo! Design Co. | January 23, 2023

I have a membership site where I need to display certain FacetWP results to people who are logged in and other FacetWP results to people who are logged out. Unfortunately, FacetWP forgets WordPress’ global $current_user variable the minute you use one of the facets. Same with WordPress’ is_user_logged_in() function – FacetWP forgets it all once…

How to shrink the size of wp_options table in WordPress

By The Mighty Mo! Design Co. | January 20, 2023

I was recently horrified to discover that the “wp_options” table of this site was over 1.3 gigabytes in size. For those of you counting at home – that is ENORMOUS and unnecessary. I was confused, because the table seemed to balloon overnight (and likely did balloon overnight, it turns out!). The issue was caused by…

RSS From Toby’s Blog

  • Where uncertainty exists, don’t order specific.
    4 Idiot Case Studies with 2 simple age-old business lessons. The post Where uncertainty exists, don’t order specific. appeared first on Toby Cryns, WordPress Trainer in Minneapolis, MN.
  • “Now THAT was a good meeting!”
    A single effective meeting can change the course of history for a company. Imagine if you could lead effective meetings EVERY DAY! You can, but it takes curiosity & practice. This article is a good place to start your journey to a more effective you. The post “Now THAT was a good meeting!” appeared first […]
  • Never Respond to RFPs & Custom Proposal Requests
    Y'all who work at normal 9-5 jobs don't need to deal with the B.S. that is an RFP process (or rather you get paid to deal with it). But us freelancers gotta deal with a whole big bag of schtuff when it comes to custom proposals. Here's my quick-and-dirty RFP filtering process that I use […]