Reply To: Background scrolling in the responsive devices

Hi Elise,
Thank you for your guidance. Could you please verify the below said code is correct?

Theme Settings > Custom JS > On Document ready:

(function($) {
$(document).on(‘wdQuickViewOpen’, function() {
$.magnificPopup.instance.st.callbacks.close = function() {
document.querySelector(‘html’).style.removeProperty(‘overflow-y’)
}

document.querySelector(‘html’).style.setProperty(‘overflow-y’, ‘hidden’)
});
})(jQuery);

var closeSide = document.querySelector(‘.wd-close-side’);

if ( closeSide && window.innerWidth < 768 ) {
var observer = new MutationObserver((changes) => {
if(changes[0].attributeName.includes(‘class’)) {
if(closeSide.classList.contains(‘wd-close-side-opened’)) {
document.querySelector(‘html’).style.setProperty(‘overflow-y’, ‘hidden’)
} else if(! closeSide.classList.contains(‘wd-close-side-opened’)) {
document.querySelector(‘html’).style.removeProperty(‘overflow-y’)
}
}
});
observer.observe(closeSide, {attributes : true});
}

Theme Settings > Custom CSS > Global:

@media (max-width: 1024px) {

.mfp-wrap.quick-view-wrapper {
position: fixed !important;
overflow-y: scroll;
max-height: 100vh !important;
top: 0 !important;
bottom: 0 !important;
}
}

Regards,
SP