JSFiddle - React, Tailwind, and code Playground
HTML
<button id="lock">Toggle Scroll Lock</button>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque convallis urna non arcu feugiat sollicitudin. Quisque et est a nisl blandit hendrerit. Nulla elit velit, imperdiet eget consectetur vel, iaculis id turpis. Vivamus facilisis, lectus eget interdum iaculis, eros lectus sollicitudin nulla, id consectetur lacus mi ut orci. Morbi dui ipsum, elementum quis odio at, tincidunt scelerisque tortor. Cras nunc arcu, tincidunt non odio sit amet, scelerisque varius nisi. Phasellus augue purus, faucibus in interdum vitae, laoreet nec ligula. Cras ornare, erat pulvinar pellentesque dignissim, tortor massa tincidunt augue, quis ultricies elit quam et mauris. Etiam ornare tempor pharetra.
Morbi est massa, suscipit sed feugiat id, commodo a diam. Maecenas aliquam dignissim ipsum. Aliquam et suscipit leo. Sed cursus felis nec orci fringilla aliquet. Proin ultricies, risus in lacinia aliquam, leo mi aliquam nisl, vitae facilisis quam magna eget enim. Suspendisse ut dui id risus auctor cursus nec ac libero. Nulla sed tellus a dolor mattis posuere vitae ac magna. Mauris pellentesque aliquet blandit. Praesent mi elit, luctus eget imperdiet a, rhoncus sit amet lorem. Nunc bibendum commodo risus, sit amet fermentum diam dapibus eu. Vestibulum vitae cursus odio, sit amet egestas nisi. Curabitur risus urna, ultricies in leo nec, porttitor vulputate est.
Curabitur elementum scelerisque eros nec sagittis. Aliquam non nibh leo. Sed ornare fermentum dictum. Maecenas ut nulla sit amet erat ullamcorper euismod. Ut at fringilla est. Suspendisse potenti. Maecenas at quam ullamcorper, pretium sapien in, iaculis erat. Donec euismod rutrum mauris in congue. Quisque commodo urna nec ligula faucibus convallis. Nullam ligula est, vulputate sed sem eget, dignissim feugiat tortor. Integer malesuada eu erat at vehicula. Quisque nec sem in orci commodo feugiat. Donec dignissim lectus ultricies, ornare orci elementum, molestie arcu.
Vivamus...
CSS
button {
position: fixed;
left: 20px;
top: 20px;
padding: 20px;
}
JavaScript
(function() {
var $window = $(window), previousScrollTop = 0, scrollLock = false;
$window.scroll(function(event) {
if(scrollLock) {
$window.scrollTop(previousScrollTop);
}
previousScrollTop = $window.scrollTop();
});
$("#lock").click(function() {
scrollLock = !scrollLock;
});
})();