Use CSS
body.modal-open {
height: 100vh;
overflow-y: hidden;
padding-right: 15px; /* Avoid width reflow */
}
Use JavaScript
// When the modal is shown, we want a fixed body
document.body.style.position = 'fixed';
document.body.style.top = `-${window.scrollY}px`;
// When the modal is hidden, we want to remain at the top of the scroll position
const scrollY = document.body.style.top;
document.body.style.position = '';
document.body.style.top = '';
window.scrollTo(0, parseInt(scrollY || '0') * -1)