Support » Plugin: PopBox For Elementor » Main scrollbar disappears upon triggering a modal, page content shifts right

  • besweeet


    Is there a way to prevent the main scrollbar from disappearing after triggering a modal? The content shifts right and it looks off.

Viewing 2 replies - 1 through 2 (of 2 total)
  • A few people are asking about this, me included. You’re the most recent posting, so I’ll reply here =). I’ve spent the day learning about this, it’s actually a talked-about issue in web development, and specifically Bootstrap (which is used to render the modal). The plugin author mentions plans to include this in the plugin, but it’s been a long while and it doesn’t seem to be in the plugin yet (I don’t see it in the code).

    To stop page shifting when the modal comes up:

    Add this to your theme’s style.css:

    html.modal-open {
        /* All of this stops the page from scrolling in the background, especially important on mobile devices. */
        -ms-overflow-style: scrollbar;
        overflow: hidden;
        height: 100%;
    body.modal-open {
      /* This is the crucial rule to get rid of the page shift when opening a modal */
      overflow: auto !important;
      /* You may want to explore toggling this, depending on your circumstances (page length and/or presence of page scroll bars) */
      height: 100%;

    Add this to your theme’s scripts:

    jQuery(document).ready(function($) {
        /* The following adds/removes classes to <html> accordingly */
        $('#mypopup').on('', function (e) {
        $('#mypopup').on('', function (e) {
    • This reply was modified 5 months, 2 weeks ago by  MountainSmoke.


    I also had this question so thanks for the excellent solution @mountainsmoke !!

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.