我有一个水平居中的容器，带有一个导航栏，可以用 js 隐藏和显示不同长度的 div。有时，如果显示的 div 中的内容太长，显示 div 也会显示滚动条，并导致页面在某些浏览器中“跳转”到左侧。CSS 只是 Bootstrap 的基本脚手架。
以下是网站上正在发生的事情的要点。但您可以在这里看到生产中的问题：http: //dylanpatrickclark.com
<body>
<script type="text/javascript">
$(document).ready(function(){
function setNavState(currentHash) {
$('nav ul li').removeClass('active');
var selector = 'nav ul li a[href="' + currentHash + '"]';
$(selector).parent().addClass('active');
};
function hash() {
var hash = window.location.hash;
if (hash != ''){
$('.tabs div').hide();
$(hash).show();
}
else {
$('.tabs div').hide();
$('.tabs div#tab1').show();
hash = 'tab1'
}
setNavState(hash);
};
hash();
$(window).bind('hashchange', function() {
hash()
});
});
</script>
<h1>Hello, world!</h1>
<div class="container">
<div class="row">
<nav>
<ul>
<li> <a href="#tab1">Tab1</a> </li>
<li> <a href="#tab2">Tab2</a> </li>
</ul>
</nav>
</div>
</div>
<div class="row">
<div class="tabs">
<div class="tab-pane" id="tab1">
<p>Short</p>
</div>
<div class="tab-pane" id="tab2">
<p>Long</p>
</div>
</div>
</div>
</body>
我在这里看到了很多关于这个问题的旧答案，其中很多建议强制滚动条显示，但我宁愿使用 js 插入填充以补偿滚动条。我认为facebook会做这样的事情。我真的不想担心 IE 支持，因为我主要专注于寻找一个我可以理解的解决方案，我对 javascript 的基本了解。
任何人都可以简单地解释如何最好地用javascript补偿滚动条的出现/消失吗？太感谢了！
