隐藏默认浏览器滚动条，避免溢出:使用完美滚动条时隐藏
我在我的网页上使用“完美滚动条”。为了隐藏默认浏览器滚动条，它添加了“溢出:隐藏”。(http://noraesae.github.io/perfect-scrollbar/)
我还在可滚动部分中使用Jquery可排序。(http://jqueryui.com/sortable/)完美滚动所需的溢出是可排序的障碍。当我拖动一个div时，它不会根据需要向下滚动，因为溢出是隐藏的。(但当你用鼠标滚轮滚动时，它会滚动)。
当我删除溢出:隐藏默认滚动条和完美滚动条显示。(两人都按预期工作)
因此，我如何直观地隐藏滚动条，使溢出不被隐藏，而只有滚动条是不可见的。
回答 3
Stack Overflow用户
发布于 2014-06-06 08:23:36
您可以将整个页面包含在一个高度和宽度等于窗口的div中，然后在该div上应用完美的滚动条。
HTML：
<div class="body">
<!-- page content -->
</div>JS
$(".body").css({
"width": $(window).width() + "px",
"height": $(window).height() + "px"
});Stack Overflow用户
发布于 2014-06-06 08:32:22
这里的简单答案是，如果不使用overflow: hidden，就无法隐藏滚动条。
尽管webkit浏览器在CSS中确实支持::-webkit-scrollbar、::-webkit-scrollbar-button、::-webkit-scrollbar-track、::-webkit-scrollbar-track-piece、::-webkit-scrollbar-thumb、::-webkit-scrollbar-corner和::-webkit-resizer，但针对其他浏览器将很困难。
一种可能的“黑客”可能是将内容包装在与窗口大小相同的div中，将PerfectScrollbars应用于said div，并将jQuery可排序的内容放置在子div中。
Stack Overflow用户
发布于 2018-09-28 02:11:26
你可以试试这个
HTML
<body>
<div id="scroll">
//Your all content
</div>
</body>CSS
body{
overflow: hidden;
}
#scroll{
position: relative;
margin: 0px auto;
padding: 0px;
width: auto;
height: auto;
}JS
$(window).resize(function(){
$("#scroll").css({
"width": $(window).width() + "px",
"height": $(window).height() + "px"
});
});
const ps = new PerfectScrollbar('#scroll', {
wheelSpeed: 2,
wheelPropagation: true,
minScrollbarLength: 20
});
ps.update();https://stackoverflow.com/questions/24077238
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号