Question

我的导航中有一个链接可以打开页面上的特定选项卡，链接工作正常，但页面打开，因此内容的开头被固定的导航栏隐藏。任何人都可以帮助我，我是新手，并且在java中不是很好：

var gotoHashTab = function (customHash) {
    var hash = customHash || location.hash;
    var hashPieces = hash.split('?'),
        activeTab = $('[href=' + hashPieces[0] + ']');
    activeTab && activeTab.tab('show');
}

// onready go to the tab requested in the page hash
gotoHashTab();

// when the nav item is selected update the page hash
$('.nav a').on('shown', function (e) {
    window.location.hash = e.target.hash;
})

// when a link within a tab is clicked, go to the tab requested
$('.tab-pane a').click(function (event) {
    if (event.target.hash) {
        gotoHashTab(event.target.hash);
    }
});

或者是否有更好的脚本使用外部链接在bootstrap 3的不同页面上打开特定选项卡？

Answer 1

将类.anchor放在锚点（目标）上。

如果导航栏仅固定在某些尺寸上，那么??? px所在的位置，放置该断点的最小宽度（md及以上为992px，大而向上为1200px，小而向上为768px）

@media (min-width: ???px) {
  .anchor {
    padding-top: 60px;
    margin-top: -60px;
  }
}

如果在所有屏幕尺寸都固定：

 .anchor {
    padding-top: 60px;
    margin-top: -60px;
  }

假设导航栏上的高度为50px。此外，如果您的身体顶部填充按照getbootstrap具有导航栏高度的填充，则可能不。例子。

当外部链接打开Tab时，页面滚动到顶部也固定了导航栏

1 个答案: