I have a m开发者_JAVA百科enu that shows the submenu on hover. My problem is that when the page loads, if the mouse is over any of the menu elements then the hover event will fire. What I would like to happen is that on initial page load the hover event will not fire if the mouse is over one of the menu elements; if the mouse is not over a menu element then the normal hover event would fire once the user mouse's over a menu element.
Thanks in advance for any and all help, B
@Mörre idea is good, here's a inspired one, using jQuery:
$(document).ready( function() {
// sets a loaded class on your menu when DOM is loaded (you could also try the $(window).load event)
$('#menu').addClass('loaded');
// add the hover event on the links of your menu only if the menu has the loaded class
$('#menu.loaded a').live('mouseover mouseout', function(event) {
if (event.type == 'mouseover') {
// do something on mouseover
} else {
// do something on mouseout
}
});
});
Prevent the default behavior for the hover element from firing.
$("menuElementSelector").hover(function(e){
e.PreventDefault();
});
use hoverIntent jquery plugin. You can delay de reponse of the event. So, when the mouse is over, the event won´t be trigger immediately.
精彩评论