Hello! I am trying to figure out how to stop the body scrolling when my modal is opened.
As you can see, in this page https://uxdbbackup.webflow.io/old-home in tablet or lower res devices, it appears a button “Browser all categories” which opens a modal windows.
But If you scroll to the bottom and continue, the body will continue scrolling, so when the user clicks close, it will appear in the lower part of the site.
Here’s the modal position:
And this is the script I am trying to:
<script>
Webflow.push(function() {
$(‘.browserallcategories’).click(function(e) {
e.preventDefault();
var clicks = $(this).data('clicks');
if (clicks) {
$('body').css({
overflow: 'scroll',
'-webkit-overflow-scrolling': 'touch',
position: 'inherit',
top: '0'
});
$(window).scrollTop($(this).data('offset'));
} else {
$(this).data('offset', window.pageYOffset);
$('body').css({
overflow: 'hidden',
height: 'auto',
position: 'absolute',
top: 0 - window.pageYOffset
});
}
$(this).data("clicks", !clicks);
});
});
What am I doing wrong?
Thanks!!!