Make Background of page not scrollable when modal is open

  • Resolved oliverlehne

    (@oliverlehne)


    1 year, 4 months ago

    I have quite a lot of text in my modal and the user scrolls through the text (this works great so far). But as soon as the user reaches the end (or top) of the content, the actual page continues to scroll, even though the modal has not been closed yet. How can this be easily prevented? Is there CSS for this? I am happy about any hint.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter oliverlehne

    (@oliverlehne)

    Mit folgendem JavaScript konnte ich die gewünschte Funktionalit?t herstellen. Vielleicht dient es als Ansto? für die Weiterentwicklung dieser Funktionalit?t für das Plugin.

    var overlay = document.querySelector(‘.bod-block-popup-overlay’); function checkClasses() {
    if (overlay.classList.contains(‘active’))
    { document.body.style.overflow = ‘hidden’; }
    else {
    document.body.style.overflow = ”; }
    }
    var observer = new MutationObserver(checkClasses);
    var config = { attributes: true };
    observer.observe(overlay, config)

    Plugin Author merbmerb

    (@merbmerb)

    Sorry for the late reply. You can also use the custom events I created.

    (function($){

    $(document).on(“bod-modal-before-open”){

    document.body.style.overflow = ‘hidden’;

    });

    $(document).on(“bod-modal-after-close”){

    document.body.style.overflow = ‘’;

    });

    })(jQuery);

    Thread Starter oliverlehne

    (@oliverlehne)

    No problem, your response is still fast enough ?? I removed my code and now working with yours in the functions.php. Thanks a lot and i am looking forward to use your great plugin in many projects in the future aswell! Keep the great work up ??

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Make Background of page not scrollable when modal is open’ is closed to new replies.