HTML
CSS
JavaScript
<div class='container'><div class='scrollable'>Scroll me!<br>Keep scrolling down...<br>Keep scrolling down...<br>Keep scrolling down...<br>Keep scrolling down...<br>Keep scrolling down...<br>Keep scrolling down...<br>Keep scrolling down...<br>Keep scrolling down...<br>Keep scrolling down...<br>Keep scrolling down...</div></div>
.container { height: 200px; width: 300px; border: 2px solid #333; overflow: hidden; } .scrollable { height: 400px; overflow-y: scroll; overscroll-behavior: contain; overscroll-behavior-block: contain; background-color: #f0f0f0; padding: 10px; }
// No JavaScript required for this demo
Scroll me!
Keep scrolling down...
Keep scrolling down...
Keep scrolling down...
Keep scrolling down...
Keep scrolling down...
Keep scrolling down...
Keep scrolling down...
Keep scrolling down...
Keep scrolling down...
Keep scrolling down...