Javascript 覆盖菜单落在标题后面

“我的标题”出现问题，它出现在单击汉堡时出现的“我的覆盖菜单”前面。我试着用更高的z指数，但没用

任何建议都是明智的

/*！
*classie v1.0.0
*类辅助函数
*来自邦佐https://github.com/ded/bonzo
*麻省理工学院执照
* 
*classie.has（elem，'我的类'）->真/假
*添加（元素“我的新类”）
*类移除（元素“我不想要的类”）
*classie.toggle（元素“我的类”）
*/
/*jshint浏览器：true、strict:true、undef:true、unused:true*/
/*全局定义：false*/
（功能（窗口）{
"严格使用",；
//来自bonzo的类帮助器函数https://github.com/ded/bonzo
函数classReg（className）{
返回新的RegExp（“（^ |\\s+”+className+”（\\s+|$）”）；
}
//类列表对类管理的支持
//虽然公平地说，api很糟糕，因为它不会同时接受多个类
变量hasClass、addClass、removeClass；
if（'classList'在document.documentElement中）{
hasClass=函数（元素，c）{
返回元素classList.contains（c）；
};
addClass=函数（元素，c）{
元素类列表添加（c）；
};
removeClass=函数（elem，c）{
元素类列表。删除（c）；
};
}
否则{
hasClass=函数（元素，c）{
返回classReg（c）.test（elem.className）；
};
addClass=函数（元素，c）{
如果（！hasClass（elem，c））{
elem.className=elem.className+''+c；
}
};
removeClass=函数（elem，c）{
elem.className=elem.className.replace（classReg（c），“”）；
};
}
函数切换类（elem，c）{
var fn=hasClass（elem，c）？removeClass:addClass；
fn（elem，c）；
}
风险等级={
//全名
hasClass:hasClass，
addClass:addClass，
removeClass:removeClass，
toggleClass:toggleClass，
//简称
has:hasClass，
add:addClass，
remove:removeClass，
切换：切换类
};
//运输
if（typeof define==='function'&&define.amd）{
//AMD
定义（分类）；
}否则{
//浏览器全局
window.classie=classie；
}
})（窗口）；
（功能（）{
var$navUL=$（'navUL'）；
$（'.hamburger菜单'）。打开（'单击'，函数（）{
$（this.toggleClass（'show'）；
$navUL.toggleClass（'hidden'）；
} );
} )();
函数init（）{
window.addEventListener（'scroll'，函数（e）{
var distance=window.pageYOffset | | document.documentElement.scrollTop，
shrinkOn=300，
页眉=document.querySelector（“页眉”）；
如果（距离>收缩）{
类别添加（标题，“较小”）；
}否则{
如果（类别有（标题，“较小”））{
类别移除（标题“较小”）；
}
}
});
}
window.onload=init（）
@import“compass/css3”；
$bar宽度：50px；
$bar高度：4倍；
$bar间距：15px；
身体{
背景：#000000；
字体系列：Teko；
颜色：#ffffff；
}
汉堡菜单{
位置：固定；
z指数：1；
顶部：45px；
左：45像素；
保证金：自动；
宽度：$bar宽度；
高度：$bar height+$bar SPACE*2；
光标：指针；
}
.文本{
左边距：60像素；
字号：18px；
字母间距：.05em；
颜色：#ffffff；
-webkit转换：translateX（0）；
过渡：所有350毫秒的缓进缓出；
垂直对齐：中间对齐；
位置：相对位置；
z指数：1；
}
.show.text{
不透明度：0；
转换：translateX（-10px）；
}
巴尔先生，
酒吧：之后，
酒吧：以前{
宽度：$bar宽度；
高度：$bar高度；
}
.酒吧{
位置：相对位置；
z指数：1；
变换：translateY（$bar间距）；
背景：rgba（188,49254,1）；
过渡：所有0毫秒300毫秒；
.show&{
背景：rgba（255，255，255，0）；
}
}
酒吧：以前{
内容：“；
位置：固定；
z指数：1；
左：0；
底部：钢筋间距；
背景：rgba（188,49254,1）；
变换：底部300毫秒300毫秒三次贝塞尔（0.23,1,0.32,1），变换300毫秒三次贝塞尔（0.23,1,0.32,1）；
}
酒吧：之后{
内容：“；
位置：固定；
z指数：1；
左：0；
顶杆间距；
背景：rgba（188,49254,1）；
过渡：顶部300毫秒300毫秒三次贝塞尔（0.23,1,0.32,1），变换300毫秒三次贝塞尔（0.23,1,0.32,1）；
}
酒吧：之后{
排名：0；
变换：旋转（45度）；
背景：rgba（0,0,0,1）；
变换：顶部300毫秒三次贝塞尔（0.23,1,0.32,1），变换300毫秒300毫秒三次贝塞尔（0.23,1,0.32,1）；；
}
酒吧：以前{
底部：0；
变换：旋转（-45度）；
背景：rgba（0,0,0,1）；
变换：底部300毫秒三次贝塞尔（0.23,1,0.32,1），变换300毫秒300毫秒三次贝塞尔（0.23,1,0.32,1）；；
}
.覆盖{
位置：固定；
边框样式：实心；
边框宽度：1米；
边框颜色：黑色；
排名：0；
右：0；
底部：0；
左：0；
颜色：#333；
背景色：#bc31fe；
}
李国荣{
保证金：0；
填充：0；
字体系列：Teko；
字体大小：粗体；
字号：0.8em；
列表样式：无；
文本对齐：居中；
}
导航ul{
位置：固定；
最高：50%；
文本对齐：居中；
&.隐藏{
显示：无；
}
a{
@包括过渡时间（0.5s）；
文字装饰：无；
颜色：白色；
字号：3em；
线高：1.5；
}
}
李国荣{
显示：内联；
保证金：0.5雷姆；
}
.覆盖。联系人{
位置：固定；
底部：37像素；
左：0；
右：0；
垫底：15px；
文本对齐：居中；
字母间距：.01em；
z指数：2；
}
.联系人{
字体大小：16px；
线高：1.5；
颜色：#10131a；
字母间距：.1米；
文本转换：大写；
字号：700；
文本对齐：居中；
}
.bigtext{
字体大小：50em；
}
标题{
宽度：100%；
高度：150像素；
溢出：隐藏；
位置：固定；
排名：0；
左：0；
z指数：999；
背景色：#0683c9；
-webkit过渡：高度0.3s；
-moz过渡：高度0.3s；
-ms转换：高度0.3s；
-o型过渡：高度0.3s；
过渡：高度0
  window.addEventListener('scroll', function(e){

        var distanceY = window.pageYOffset || document.documentElement.scrollTop,
            shrinkOn = 300,
            header = document.querySelector("header");
        if (distanceY > shrinkOn) {
            classie.add(header,"smaller");
          $('.overlay').css('marginTop',110);
        } else {
            if (classie.has(header,"smaller")) {
                classie.remove(header,"smaller");
              $('.overlay').css('marginTop',150);
            }
        }

    });
}

header.smaller h1#logo {
  margin-left: 180px;
}