Question

我做了类似的事情，最初隐藏了身体滚动条，然后在点击链接时显示它：

$('body').css('overflow', 'hidden');
$('#site').click(function(e) {
    $('#wrapper').remove();
    $('body').css('overflow', 'scroll');
    return false;
});

首先，它会隐藏滚动条，只显示覆盖的滚动条（绝对定位的div（#wrapper）），但是当我点击链接（#site）再次显示滚动条（并删除叠加层）时，它现在显示两个滚动条：一个正在工作，另一个被禁用。

HTML：

<div id="wrapper">
   --- some content ----
   <a href="" id="site"></a>
</div>

<div>
   --- rest of the website ---
</div>

CSS：

#wrapper {  
    background-color: #CCC;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99999; 
    height: 800px;
}

出了什么问题？

Answer 1

找到解决我问题的方法。我只需要添加：

$('html').css('overflow', 'hidden');

Answer 2

如果主题或样式中的某些内容导致第二个栏

，您也可以使用它

html {
  overflow-x: initial !important;
}

Answer 3

就我而言，我尝试过

$('html').css('overflow', 'hidden');

这将删除两个侧边栏，但我无法向下滚动到页脚。

我用过：

$('html').css('overflow-x', 'initial');

运行状况良好，垂直仅显示一个滚动条，并且可滚动到底部的所有内容

Answer 4

使用overflow-x和overflow-y管理水平和垂直滚动条。只需将overflow-x: none;设置为停止显示水平条。

Answer 5

两个滚动条是指垂直和水平滚动条？如果是，请使用overflow：auto而不是scroll

http://jsfiddle.net/DmqbU/2/

这将有效地仅在需要时显示滚动条（如果水平内容宽于宽度或垂直内容高于高度）

Answer 6

这为我解决了问题：

body{overflow-y:auto}

Answer 7

将这些行添加到您的 style.css 代码中：

html {
    height:100%;
    width:100%;
    margin:0%;
    padding:0%;
    overflow-x: hidden;
}

body {
    overflow-x: hidden;
}

为什么要显示两个垂直滚动条？

HTML：

CSS：

7 个答案: