Question

我的页面顶部有一个粘性导航，我也有一个右列。

我的问题是，当我将侧面导航链接到锚点时，它会将页面滚动到该锚点并将其放在顶部导航后面。

无论如何我可以拥有它所以它将页面滚动到实际锚点之上的100px，所以它不在顶部粘性导航的后面？

我在顶部导航栏中使用affix-top的引导程序，在右栏导航栏中使用data-spy="scroll" and also词缀

粗体

由于我使用的是data-spy="scroll"，这会影响scrollspy的工作方式，因为锚点会在更改侧导航中的间谍之前进入顶部导航。

这就是我蚂蚁在我的锚上有一个偏移的原因。

Answer 1

只要您可以设置它以便它不会干扰您的布局的其余部分，以下是一种简单的方式来做您想要的：

示例Jsfiddle：http://jsfiddle.net/qWHgR/

selector {
    padding-top: 200px;
    margin-top: -200px;
}

我个人并不熟悉Scrollspy，因此如果偏移成为问题，您可能需要对其进行一些小的更改。

Answer 2

+1 @Nit建议。我喜欢它在内联和块级元素上运行得非常好，不会想到。

http://jsfiddle.net/gCs7C/

HTML：

<nav>
    <a href="#hash">Scroll to content</a>
</nav>
<div>Spacer</div>
<div>
    Spacer<br />
    <span id="hash">Content</span>
</div>

CSS：

html, body {
   padding: 0;
   margin: 0;
}

div {
    height: 1000px;
}

nav {
    position: fixed;
    height: 24px;
    width: 100%;
    background-color: yellow;
}

#hash {
    padding-top: 24px;
    margin-top: -24px;
}

链接到页面锚定垫顶部

2 个答案: