如何始终在浏览器中显示垂直滚动条？
我想始终在我的网页上显示垂直滚动条。 是否有可能使用JavaScript？ 我认为这是可能的使用JavaScript或jQuery。 我想要垂直滚动条是否有足够的内容显示或不。
谢谢。
jQuery不应该是必需的。 你可以尝试添加CSS：
body {overflow-y:scroll;} 这适用于最新的浏览器，甚至IE6。
只需要注意一点：在OS X Lion中，设置为“滚动”的溢出行为更像是自动的，滚动条只会在使用时显示。 不使用时会消失。 所以，如果任何上述解决scheme似乎没有工作，这可能是为什么。
这是你需要解决的问题：
::-webkit-scrollbar { -webkit-appearance: none; width: 7px; } ::-webkit-scrollbar-thumb { border-radius: 4px; background-color: rgba(0, 0, 0, .5); -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5); }
你可以相应地devise它。
只要使用CSS。
body { overflow-y: scroll; }
设置一个包含div的overflow属性 scroll 。
尝试在你的身体标签的onload方法上调用一个函数，并在该函数中改变这个body的样式document.body.style.overflow ='scroll'; 你也可能需要设置你的HTML的宽度，因为这也会显示水平滚动条
你的html文件看起来像这样
<script language="javascript"> function showscroll() { document.body.style.overflow = 'scroll'; } </script> </head> <body onload="showscroll()">
这是一个方法。 这不仅会提供滚动条容器，而且即使内容不够（根据您的要求）也会显示滚动条。 也将工作在iPhone和Android设备以及..
<style> .scrollholder { position: relative; width: 310px; height: 350px; overflow: auto; z-index: 1; } </style> <script> function isTouchDevice() { try { document.createEvent("TouchEvent"); return true; } catch (e) { return false; } } function touchScroll(id) { if (isTouchDevice()) { //if touch events exist... var el = document.getElementById(id); var scrollStartPos = 0; document.getElementById(id).addEventListener("touchstart", function (event) { scrollStartPos = this.scrollTop + event.touches[0].pageY; event.preventDefault(); }, false); document.getElementById(id).addEventListener("touchmove", function (event) { this.scrollTop = scrollStartPos - event.touches[0].pageY; event.preventDefault(); }, false); } } </script> <body onload="touchScroll('scrollMe')"> <!-- title --> <!-- <div class="title" onselectstart="return false">Alarms</div> --> <div class="scrollholder" id="scrollMe"> </div> </body>
将该类添加到要滚动的div。
overflow-x：hidden; 隐藏水平滚动条。 当overflow-y：scroll; 允许您垂直滚动。
<!DOCTYPE html> <html> <head> <style> .scroll { width: 500px; height: 300px; overflow-x: hidden; overflow-y: scroll; } </style> </head> <body> <div class="scroll"><h1> DATA </h1></div>
