I'm trying to use the hoverIntent plugin with jQuery, but I don't fully understand how it works and was hoping someone could help me out with a few issues I'm having.
The page I'm working on is at http://schollsferryauto.com , the two buttons in the upper right corner of the page which are "Hours" and "Locations" are where I'm having problems. The original intent was to allow someone to mouseover these buttons where an information window would expand down and disappear on mouseout. This works to some degree, but I'm having a problem when you then move the mouse down over the new windowed area. It tends to close and then reopen when moving the mouse over different areas instead of staying open. I'm using nested DIV tags to create each of the boxes that drop down. I need multiple DIV tags for the rounded corners effect that should be applied around each box using the curvy corners jQuery plugin. Right now it seems to work the best with the following code for the hours button and drop down window. $("#btn_hours,#menu-hours-down").hoverIntent({ sensitivity: 2, interval: 750, over: menuHoursOpen, timeout: 1250, out: menuHoursClose }); What is the proper code? Should I include all nested DIV ids or just the parent? Also, can a hoverIntent event along with a click event be applied to the same element? This would be in cases where the user might want to click instead of waiting for the hoverIntent to trigger - or for the users who don't slow the mouse down long enough for it to trigger. On another issue... I have another problem with the customer quotes drop down when moused over it should open downward using hoverIntent and stay open as long as the mouse is over any part of this dropdown. There is a link on here that may need to be clicked by the visitor. This seems to work most of the time, but from time to time I move the mouse over the drop down and it will collapse or collapse and reopen rapidly. This quirk seems to only happen after you've closed it once and then try to open it again. There is a second problem with the customer quotes in IE7, when it's in the open state. You'll notice the customers quotes box displays behind the Welcome and callout box with the picture and text. I've upped the z-index on the customer quotes elements and still can't get it to work properly. What am I missing? (I'm sure it's probably right in front of my face) I would really appreciate any help someone can provide, I've almost given up trying to get this issues resolved. Thank you in advance.
