0

jquery 菜单被编程为在鼠标悬停时动画出来并在鼠标悬停时折叠。然而,当用户将鼠标悬停在项目上时,这是一个问题,因为当用户到达其中一个框的边缘时,它不再将其视为将鼠标悬停在整个菜单上。任何图像上都没有填充/边距或边框。这是一个 2 x 3 的正方形网格,所以所有的都很好地组合在一起。这是与每个列表元素相关的 jquery 代码。

$("li.menu3").mouseover(function(){

$("ul.inactive3").stop().animate({width: "500px", height: "150px"}, "fast", function(){ $("ul.inactive3").stop().动画({宽度:“500px”,高度:“300px”},“快”);

});

});

$("li.menu3").mouseout(function(){

$("ul.inactive3").stop().animate({width: "500px", height: "150px"}, "fast", function(){ $("ul.inactive3").stop().动画({宽度:“0px”,高度:“0px”},“快”);

});

我尝试通过简单地使用一个图像并将多个图像映射放在顶部来克服这个问题,但是这带来了鼠标悬停在 chrome 中不起作用的新问题。

任何帮助将不胜感激。,

谢谢,迈克

4

1 回答 1

0

我找到了答案,使用了一个名为 hoverintent 的 jquery 插件。

链接在这里,以防其他人遇到同样的问题

http://cherne.net/brian/resources/jquery.hoverIntent.html

于 2010-12-08T14:11:07.507 回答