Question

我有一个带有下拉列表的导航栏，下拉列表中有一系列链接。下拉列表中的每个链接都链接到同一页面，但该页面上的不同选项卡。因此，当您单击指向选项卡3的链接时，将在该页面上自动选择第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>

当然，您可以调整偏移以匹配它向下滚动的距离。

停止下一页滚动链接链接

1 个答案: