问题
I'm trying to remove the bounce when scrolling in chrome. You'll notice the top white black is fixed and behind the second yellow block as desired.
What I need to do is remove the scroll to reveal the grey background in the browser without preventing the scroll over the top white block. Hope it makes sense
HTML
<div class="project">
</div>
<div id="content">
<div class="warface">
</div><!-- END warface -->
</div><!-- END content -->
回答1:
Bounce scroll in the browser is a feature of some versions of iOS / macOS.
To prevent it from happening on a website we can use the following:
CSS
html, body {
height: 100%;
overflow: hidden;
}
#mainContainer {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
overflow: auto;
}
HTML
<body>
<div id="mainContainer">
...
</div>
</body>
Demo
回答2:
There's a simpler answer suggested here for a related question: OSX - disable inertia scroll for "single-page" webapp
body {
overflow: hidden;
}
来源：https://stackoverflow.com/questions/21209223/remove-bounce-on-scroll-in-browser-issue-with-positionfixed-div