Javascript 根据菜单高度更改定位点位置

如何动态调整

top:-50px

这样它会根据菜单是否打开而增加，以避免在用户导航到它时隐藏节标题

在下面的示例中，我有一个固定顶部导航栏，允许用户跳转到页面上的特定部分。锚定位置有

top:-50px

用于说明导航栏，以便用户跳转到导航栏时导航栏不会覆盖部分标题。当显示器足够小时，导航栏会在菜单中隐藏其项目，该菜单会扩展到比导航栏更高的高度。单击菜单中的某个节项仍将跳转到该节，但它也将覆盖该节的标题

非常感谢您的帮助，谢谢

标题
正文{页边距：0；}
托普纳夫先生{
溢出：隐藏；
背景色：#000；
位置：固定；
排名：0；
宽度：100%；
文本对齐：居中；
z指数：10；
}
.topnav a{
显示：内联块；
颜色：#fff；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
字号：17px；
}
.topnav.icon{
显示：无；
}
@媒体屏幕和屏幕（最大宽度：600px）{
.topnav a{display:none；}
.topnav a.icon{
浮动：对；
显示：块；
}
}
@媒体屏幕和屏幕（最大宽度：600px）{
.topnav.responsive{位置：固定；}
.topnav.responsive.icon{
位置：绝对位置；
右：0；
排名：0；
}
.topnav.a{
浮动：无；
显示：块；
文本对齐：左对齐；
}
}
.科{
位置：相对位置；
}
.主播{
显示：块；
位置：绝对位置；
宽度：0；
身高：0；
z指数：-1；
顶部：-50px；
左：0；
可见性：隐藏；
}
函数myFunction（）{
var x=document.getElementById（“myTopnav”）；
如果（x.className==“topnav”）{
x、 类名+=“响应”；
}否则{
x、 className=“topnav”；
}
}

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这是一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

这里有一段

我不确定需要什么样的行为，但您可以将

onClick=“myFunction（）”

添加到

#myTopnav

的每个元素中，在单击时将其关闭

或者，您可以像下面这样操纵图元的样式：

var nodeList = document.getElementByClassName("anchor");
for(int i = 0; i < nodeList.length; i++) {
  nodeList[i].style.top = "-150px";
}`  

---

尽管我会推荐第一种解决方案，因为它感觉最优雅——至少在我的想象范围内。

好主意！我完全按照您的建议做了，并在每个元素中添加了

onClick=“myFunction（）”

。非常感谢。

$(".anchor").each(function(i, el) {
  el.style.top = "-150px";
});`