Javascript 当菜单的类名不是“时，我希望链接在锚点下方50px”；xxx“；

我在一个包含锚链接的div中有一个顶部菜单，如下所示：

 <div id="menu">
   <ul>
     <li>
       <a href="#item1">ITEM 1</a>
     </li>
     <li>
       <a href="#item2">ITEM 2</a>
     </li>
     <li>
       <a href="#item3">ITEM 3</a>
     </li>
   </ul>
 </div>

<div id="menu" class="wrapfixed">...</div>

当我向下滚动网站时，javascript会自动在scroll上添加一个类“wrapfixed”，以使菜单具有粘性，如下所示：

 <div id="menu">
   <ul>
     <li>
       <a href="#item1">ITEM 1</a>
     </li>
     <li>
       <a href="#item2">ITEM 2</a>
     </li>
     <li>
       <a href="#item3">ITEM 3</a>
     </li>
   </ul>
 </div>

<div id="menu" class="wrapfixed">...</div>

。。。

当类“wrapfixed”不存在时，我希望链接在锚点下方50px

你是怎么做到的

---

谢谢

要实现这一点，您需要防止#链接的默认链接行为。然后检查链接父菜单是否有

wrapfixed

类，以便设置额外的填充。使用之前，请将页面滚动到正确位置

像这样的事情应该适合你：

函数scrollToLinks（）{ var links=document.querySelectorAll（“a”）； for（设i=0，len=links.length；i

---

这是一个有效的

方法，您需要使用Javascript来防止

链接的默认链接行为。然后使用

window.ScrollTo

滚动到页面的右侧Hi Geoffery，我提供了一个答案，下面是一个工作示例，请让我知道它是否适用于您？：）嗨，Aron，不幸的是，我尝试了你的代码，但它不起作用：（我已经设置了一个log.console（padding）来查看padding的值。如果类包含“wrapfixed”，它会得到正确的值，50，否则为0，但它不会更改滚动条的任何内容，它仍然会转到相同的位置。这里的实时演示：www.cosykombucha.frOk，我认为您需要减法而不是添加填充。因此这行：

const y=box.top+padding；

将更改为

const y=window.scrollY+box.top-padding；

否，仍然相同。I认为问题来自window.scrollTo（0，y）；由于某些原因，它没有效果