Javascript 幻灯片效果导航菜单

这是我正在工作的网站

我已经对导航菜单进行了编码，以使用基本的JavaScript和CSS，但我希望它能够正确地使用向下滑动的效果

我还使用了两个导航菜单来尝试创建这种效果。我知道我不应该这样编码，但这是我让它工作的唯一方法。我真的需要一些人帮我把这个修好

除了单击菜单按钮时的幻灯片效果外，该站点当前执行我希望它执行的操作

如果有人能帮我，我会非常感激

下面是一个例子，我想我的菜单做什么

---

在这里，鼠标悬停在菜单上，它向下滑动，再次单击它，它向上滑动。这只是一个示例。你也可以通过“点击”来完成

---

这是我问题的答案

$(function(){
if(window.innerWidth <= 760) {
   $('#headerNav').hide();
}


    $("#menuIcon").click(function(){
     $("#headerNav").slideToggle("fast");
     });

    $(window).resize(function(){

    if(window.innerWidth > 760) {
    $("#headerNav").removeAttr("style");
    }

    });

})

$（函数（）{
如果（窗宽760）{
$（“#headerNav”）。删除“样式”；
}
});
})

通过此链接，我无法在菜单上看到任何向下滑动的效果。您想要的菜单在鼠标上方或其他地方会褪色。请详细说明$（函数（）{if（window.innerWidth 760）{$（“#headerNav”）.removeAttr（“style”）；}）； })

$(function(){
if(window.innerWidth <= 760) {
   $('#headerNav').hide();
}


    $("#menuIcon").click(function(){
     $("#headerNav").slideToggle("fast");
     });

    $(window).resize(function(){

    if(window.innerWidth > 760) {
    $("#headerNav").removeAttr("style");
    }

    });

})