0

我正在尝试制作一个弹出菜单,当您将鼠标悬停以显示自身时使用 jquery 动画,然后当您将鼠标移出时它会折叠。我最初是从 hoverIntent 和以下代码开始的:

function collapseMenu() {
    $("#myMenu").animate({ "left": "+=50px" }, "slow");
}

function expandMenu() {
    $("#myMenu").animate({ "left": "-=50px" }, "slow");
}

$('#myMenu').hover(expandMenu(), collapseMenu());

当我加载页面时,菜单向右移动 50 像素,然后向左移动 50 像素。然后当我真正将鼠标悬停在菜单上时,我收到以下控制台错误

未捕获的类型错误:无法调用未定义的方法“应用”

在 hoverintent.js 的第 69 和 82 行

所以我只是尝试了 jquery 的 .hover 并得到了相同的结果,没有错误。在那之后,我离题了以下测试:

$('#myMenu').mouseenter(alert("mouse entered menu"));
$('#myMenu').mouseleave(alert("mouse left menu"));

现在在页面加载时,我立即收到两个警报……悬停时什么也没有。我已经在 document.ready 和它之外(只是为了好玩)尝试了这些 mouseenter 和 mouseleave 事件,两者都有相同的结果。如果你好奇,这里是我的 html 菜单

    <ul id="myMenu" class="nav nav-list">
        <li id="lnkHome" class="active"><a href="#">Home</a></li>
        <li class="nav-header">Issue Reports</li>
        <li id="lnkSoftware" ><a href="#">Software and Apps</a></li>
        <li id="lnkOS" class="disabled"><a href="#">Operating Systems</a></li>
    </ul>
4

1 回答 1

1

尝试以下代码

$('#myMenu').hover(expandMenu, collapseMenu);

$('#myMenu').hover(expandMenu(), collapseMenu());实际上立即执行函数并将它们的返回值分配为悬停/退出事件处理程序

于 2013-04-24T00:29:04.420 回答