delaying removeClass / addClass on mouseover

delaying removeClass / addClass on mouseover

Hello.  I have the following page and when you mouseover products in the main nav you get a flyout:

http://gravityswitch.com/atalasoft/template-home.html

The flyout appears using jQuery onmouseover - one class is removed and one is added that simply displays the flyout.

The client is asking for the flyout to be delayed by a second so that if someone quickly goes over it nothing happens.  I worked on this yesterday and while I got it to delay using setTimeout the behavior wasn't what I expected (the delay would cause the mouseout to not happen at times).  I also tried .delay() which didn't work for me.

What I'm looking to accomplish is that if someone stays on the products for 1 second the flyout appears.  If they mouseover and go away within a second nothing happens.

Admittedly I'm no jQuery expert but any advice you can offer would be much appreciated!














    • Topic Participants

    • derek