0

我有一个带有下拉菜单的导航栏,下拉菜单中有一系列链接。下拉列表中的每个链接都链接到同一页面但该页面上的不同选项卡。因此,当您单击将您带到选项卡 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>
4

1 回答 1

1

您可以偏移锚选项卡的位置。我不推荐内联样式,但一个例子是:

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

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

于 2013-07-26T15:54:15.917 回答