停止锚链接在下一页上滚动

Question

我有一个带有下拉菜单的导航栏，在下拉菜单中具有一系列链接。 下拉列表中的每个链接都链接到同一页面，但该页面上的标签不同。 因此，当您单击将您带到选项卡3的链接时，该页面上会自动选择第三个选项卡。 很好，但是页面会自动向下滚动一点以集中于该选项卡，因此页面实际上跳到了该内容。 我知道这是这些#links的工作方式，但是有没有办法使页面不向下滚动到该内容却仍然选择该选项卡？

导航：

<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<li><a tabindex="-1" href=http://website.com/page/tabbedpage#howitworks>How it Works</a></li>
<li><a tabindex="-1" href=http://website.com/page/tabbedpage#technology>Technology</a></li>
<li><a tabindex="-1" href=http://website.com/page/tabbedpage#application>Applications</a></li>
<li><a tabindex="-1" href=http://website.com/page/tabbedpage#savings>Savings</a></li>
</ul>

在所有页面的顶部，用于选择标签：

<script type="text/javascript">
 $(function () {
   var activeTab = $('[href=' + location.hash + ']');
   activeTab && activeTab.tab('show');
 });
</script>

Answer 1

您可以偏移锚点的位置。 我不推荐内联样式，但是一个示例是：

<a name="howitworks" style="display: block; position: relative; top: -100px;"></a>

当然，您可以调整偏移量以匹配向下滚动的程度。