Javascript 固定标题div外的wordpress下拉菜单

我正在与一些css斗争

我有一个用javascript制作的下拉菜单。下拉菜单工作正常，但当我按下按钮时，页面顶部的固定标题将展开

我想要的是，当我按下按钮时，下拉菜单将在fixed header div外部可见

（函数（）{
var nav=document.getElementById（‘站点导航’），按钮，菜单；
如果（！导航）{
返回；
}
button=nav.getElementsByTagName（'button'）[0]；
menu=nav.getElementsByTagName（'ul'）[0]；
如果（！按钮）{
返回；
}
//如果菜单缺失或为空，则隐藏按钮。
如果（！menu | |！menu.childNodes.length）{
button.style.display='none'；
返回；
}
button.onclick=函数（）{
if（-1==menu.className.indexOf（'nav menu'））{
menu.className='nav menu'；
警惕（“哈罗”）；
}
if（-1！==button.className.indexOf（'toggled on'））{
button.className=button.className.replace（'toggled on'，''）；
menu.className=menu.className.replace（'toggled on'，''）；
警报（“更换开关打开”）；
}否则{
button.className+='已打开'；
menu.className+=“已打开”；
警报（'+=已打开'）；
}
};
}）（jQuery）；

/*导航菜单*/
.主导航{
位置：相对位置；
利润上限：24px；
保证金上限：1.714285714rem；
浮动：对；
身高：100%；
}
.menu hoofd菜单容器{
身高：100%；
溢出：隐藏；
位置：绝对位置；
左侧：-30px；顶部：0px；
宽度：100%；
}
.导航菜单{
位置：相对位置；
填充：0px；
z指数：999；
}
.主导航李{
利润上限：24px；
保证金上限：1.714285714rem；
字体大小：12px；
字体大小：0.857142857rem；
线高：1.42857143；
}
.主导航a{
颜色：#5e5e；
}
.主导航a：悬停，
.主导航a：焦点{
颜色：#21759b；
}
.主导航ul.nav-menu，
.主导航分区导航菜单>ul{
显示：无；
}
.主导航ul.nav-menu.toggled-on，
.菜单切换{
显示：内联块；
}

“alt=”logo“/>
菜单

我认为可以通过使用以下css来实现：

nav#site-navigation.main-navigation{
    position: absolute;
}

然后，您可以通过为

left

和

top

等添加值来调整其位置，请参见下面的示例

nav#site-navigation.main-navigation{
    position: absolute;
    left: 0;
    top:0;
}

这将打开菜单置于左上角，您可以根据需要替换这些值