Javascript:打开汉堡包菜单的函数+;标题在向下滚动时隐藏,在向上滚动时显示

Javascript:打开汉堡包菜单的函数+;标题在向下滚动时隐藏,在向上滚动时显示,javascript,jquery,navigation,responsive,Javascript,Jquery,Navigation,Responsive,我试图从不再使用的JS包中提取打开汉堡包菜单所需的功能。标题也应该在向下滚动时隐藏,在向上滚动时显示,在桌面和移动设备上显示 这是我到目前为止所做的,但我无法让JS工作。我仍在努力理解JS,所以请容忍我。谢谢 函数(t,e,i){ “严格使用”; Object.defineProperty(e,“\uuu esModule”{ 值:!0 }),e.default=function(){ var t=$(“资产净值”), e=t.find(“.nav切换”), i=t.偏移量().顶部+t.外部

我试图从不再使用的JS包中提取打开汉堡包菜单所需的功能。标题也应该在向下滚动时隐藏,在向上滚动时显示,在桌面和移动设备上显示

这是我到目前为止所做的,但我无法让JS工作。我仍在努力理解JS,所以请容忍我。谢谢

函数(t,e,i){
“严格使用”;
Object.defineProperty(e,“\uuu esModule”{
值:!0
}),e.default=function(){
var t=$(“资产净值”),
e=t.find(“.nav切换”),
i=t.偏移量().顶部+t.外部高度()+30,
n=!1,
o=!1,
s=0;
$(窗口).on(“滚动加载”,函数(){
var e=window.scrollY;
e>i&&!n?(n=!0,$(t).添加类(“导航固定”):es&!o?(o=!0,$(t).添加类(“导航隐藏”)、$(t).删除类(“导航显示”):e
.header.nav{
宽度:100%;
位置:绝对位置;
顶部:50px;
z指数:10
}
.标题.导航品牌{
z指数:2
}
@介质(最大宽度:1024px){
.标题.导航品牌img{
最大宽度:240px
}
}
.标题.导航切换{
宽度:25px;
高度:15px;
边缘底部:9px;
位置:相对位置;
z指数:2
}
@介质(最小宽度:1025px){
.标题.导航切换{
显示:无
}
}
.标题.导航切换栏{
位置:绝对位置;
高度:3倍;
背景色:#fff;
左:0;
转换:转换。1s轻松
}
.标题.导航切换栏:类型的第一个{
排名:0;
宽度:25px
}
.header.nav切换栏:类型的最后一个{
底部:0;
宽度:25px
}
.标题.导航包裹{
显示:-ms flexbox;
显示器:flex;
-ms-flex-pack:justify;
证明内容:之间的空间;
-ms-flex-align:居中;
对齐项目:居中
}
.标题.导航列表{
位置:固定;
高度:100vh;
宽度:100%;
排名:0;
左:100%;
背景色:#000;
过渡:左.3s立方贝塞尔(.895.03.685.22);
边际上限:0;
填充:160px07.5%;
显示:-ms flexbox;
显示器:flex;
-ms-flex方向:列;
弯曲方向:立柱;
z指数:1
}
@介质(最小宽度:1025px){
.标题.导航列表{
显示:块;
位置:静态;
高度:自动;
宽度:自动;
顶部:自动;
左:自动;
背景色:透明;
过渡:无;
左侧填充:0;
列表样式:无;
利润率:0.05倍;
填充:0
}
}
.头.李导航{
显示:内联块;
右边距:60像素
}
@介质(最小宽度:1025px){
.页眉.nav li.current-page a{
职位:相对
}
.页眉.导航李.当前页a:之后{
内容:“;
位置:绝对位置;
高度:1px;
宽度:100%;
底部:0;
左:0;
背景色:#fff
}
}
.标题.导航李a{
颜色:#fff;
字号:38px;
字号:600;
边缘底部:30px;
显示:内联块;
不透明度:0
}
@介质(最小宽度:1025px){
.标题.导航李a{
字体大小:20px;
字号:500;
页边距底部:0;
不透明度:1;
过渡:不透明度。1s线性
}
.标题.导航李a:悬停{
不透明度:.6
}
}
.标题.导航李:类型的最后一个{
右边距:0
}
.标题.导航固定{
位置:固定;
排名:0;
填充:30px 0 22px;
背景色:#131313
}
.标题.导航-固定.导航-隐藏{
-ms变换:translateY(-100%);
转换:translateY(-100%)
}
.标题.导航-固定.导航-显示{
-ms变换:translateY(0);
变换:translateY(0);
转换:转换。2轻松进入
}
.标题.导航激活.导航切换栏{
最高:50%;
底部:自动;
-ms转换:translateY(-50%);
转换:translateY(-50%)
}
.header.nav active.nav切换条:类型的第一个{
-ms变换:translateY(-50%)旋转(45度);
变换:translateY(-50%)旋转(45度)
}
.header.nav active.nav切换栏:类型的最后一个{
宽度:25px;
-ms变换:平移(-50%)旋转(-45度);
变换:translateY(-50%)旋转(-45度)
}
.标题.导航激活.导航列表{
左:0
}
.标题.导航激活.导航列表a.淡入{
动画:fadeInLeft;
动画持续时间:.4s;
动画计时功能:轻松进出;
动画填充模式:向前
}


当代码缩小时,很难理解它在做什么。您能以原始形式共享代码吗?您是指完整的JS包?超过400KB。我不知道我能否在这里发表。我可以吗?不,不是整包。但是如果我理解正确的话,您试图从一段捆绑的代码中获得一段功能,但无法让单独的代码独立工作?即使对于有经验的开发人员来说,当代码看起来像这样时,这也是一项艰巨的任务。您这样做的原因是什么?您当前尝试提取的部分已经经历了一些构建步骤,这使得它非常难以使用和维护