使用隐藏滚动条滚动[重复]
Posted
技术标签:
【中文标题】使用隐藏滚动条滚动[重复]【英文标题】：Scrolling with hiding scroll bar [duplicate] 【发布时间】：2013-12-17 15:19:27 【问题描述】：我尝试创建一个隐藏滚动条的页面，但您仍然可以滚动或单击链接向下滚动。我可以隐藏滚动条，但无法在 100% 的页面上滚动。 html
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<div id="container">
<div id="content1">Hello</div>
<div id="content2">Hello2</div>
<div id="content3">Hello3</div>
<div id="content4">Hello4</div>
<div id="links">
<a href="#content1" class="contentLink">link 1</a> |
<a href="#content2" class="contentLink">link 2</a> |
<a href="#content3" class="contentLink">link 3</a> |
<a href="#content4" class="contentLink">link 4</a>
</div>
</div>
</body>
</html>
CSS
#container, #content1, #content2, #content3, #content4
position: absolute;
width: 100%;
height: 100%;
top: 0; left: 0;
z-index: 1;
overflow:hidden
#content1 top: 0%; background: yellow;
#content2 top: 100%; background: red;
#content3 top: 200%; background: orange;
#content4 top: 300%; background: purple;
#links
position: fixed;
bottom: 10px; left: 10px;
z-index: 2;
【问题讨论】：
Didyoutried tosearch forit? “你”链接+1。 没有我要找的东西。我正在寻找没有滚动条的向下滚动和没有边框（100% 宽度和 100% 高度）以及适用于所有浏览器的方法，听说可以在 js 中完成。 【参考方案1】：只需设置滚动条的样式，而不是元素。
::-webkit-scrollbar,::-webkit-scrollbar-button,::-webkit-scrollbar-track,::-webkit-scrollbar-track-piece,::-webkit-scrollbar-thumb,::-webkit-scrollbar-corner,::-webkit-resizer
opacity:0;
更多信息在这里：http://css-tricks.com/custom-scrollbars-in-webkit/。
【讨论】：
此方法仅适用于 webkit 浏览器。以上是关于使用隐藏滚动条滚动[重复]的主要内容，如果未能解决你的问题，请参考以下文章