我创建了一个按钮,我想要做的是当我将鼠标悬停时,一个菜单切换出动画。但是当我将光标移到菜单上时,菜单会切换回来,因为它现在读取光标不再悬停在按钮上。我尝试使用“e.preventDefault();”,它会停止菜单切换回来,但所有动画似乎都被取消了。
以下是代码:
$("#logoSmall").hover(function(){
//e.preventDefault();
$("#safety_nav").toggle(function(){
$(this).animate({top: '40px', opacity:'1'}, function(){
$(this).hover(function(){
//I don't know what to put here.
});
});
});
});
请帮忙!我错过了什么?我在这做错了什么?
谢谢
答案 0 :(得分:0)
根据jQuery's API documentaion,切换不能将函数作为第一个参数。您必须先指定一个持续时间:
$("#safety_nav").toggle(500, function(){...
答案 1 :(得分:0)
由于这是家庭作业,我倾向于提供建议而不是代码: - )
这不是计划的代码问题 - 按钮是弹出菜单的触发器,但是您需要测试鼠标是否超出菜单div或按钮。您正在寻找的行为更多的是UI策略,而不是单个答案。
你可以接近它的一种方法是将按钮绑定到悬停,但是重新隐藏div的测试是按钮上的鼠标NEITEER或#safety_nav。
此外,您可能希望添加一个行为,其中任何菜单激活取消激活其他菜单,并且用户在任何菜单div外部点击隐藏所有这些(作为回退行为,以防浏览器在报告鼠标过度/结束时不稳定条件下)
祝你好运!