从页面顶部滑动导航菜单 – Jquery

首先,我在这里使用$(nav)选择器,但您可以先将其调整到您的代码中.@H_301_20@此外,你需要把你的菜单：position：relative;或位置：绝对;

为了让它滑出：

$(nav).animate({"top":$(nav).height() * -1},"slow");

要使其滑入：

$(nav).animate({"top":0},"slow");

如果你想在3秒后弹出,我们走了：

function MenuOut()
{
     /* The sample code I put on top */
     $(nav).animate({"top":$(nav).height() * -1},"slow");
}

你把它放在你的Js页面上：

/* This will run once the document is ready */
$(function()
{
    setTimeout("MenuOut",3000); /* 3000 represent 3000 milliseconds,so 3 seconds */
});

现在按钮：

function MenuIn()
{
    $(nav).animate({"top":0},"slow");
}

并将它绑定到您的按钮,如下所示：

$('#theButton').on(
{
    click: function()
    {   
        /* Hide the button,and then show up the menu */
        $(this).animate({"top":$(this).height() * -1},"slow",function()
        {
            /* I putted this in a callBACk function,so the 2 animations will be one after the other,not at the same time ! */
            MenuIn();
        });
    }
});