如果我有一个菜单,出于可访问性原因,在页面加载时可见(因此如果EU没有启用JS,那么他们仍然可以导航),但我想隐藏它,如果他们这样做启用JS,然后它很容易,只需隐藏它。但是,如果事件触发时鼠标位于元素上,我希望它保持打开状态。
问题是(无论如何,我认为这也适用于其他浏览器),如果鼠标没有移动,没有任何事件从鼠标触发以识别它当前在菜单上是否有效?
$(function(){
$("#myMenu").animate({"width": 'toggle'}, 350).hide();
});
我也尝试将它直接放入窗口加载事件中,但这不起作用,因为事件参数对象显示window
是当前目标,而不是鼠标当前所在的元素,由于窗口加载等待图像等所有问题,这也不好。
$(window).load(function(e){
console.log(e);
$("#myMenu").animate({"width": 'toggle'}, 350).hide();
});
答案 0 :(得分:1)
为什么不在鼠标移动之前无限期地显示它,然后检查鼠标是否在它上面并隐藏它是否不是?
将mousemove事件附加到窗口,然后检查它是否在DOM元素上:
$(window).mousemove(function(event) {
var mouse_x = event.pageX;
var mouse_y = event.pageY;
// then get position and height/width of menu's DOM element, hiding if the mouse isn't in it
});