Modal Popup allows tab-based navigation of webpage

Hi!
New user! Love your product, some issues:

ISSUE 1:
We don't want the user to be able to interact with the website when certain modal popups are displayed. In my situation however, even with a modal popup on the screen, the user is able to tab thru the menu (using the TAB key) & other webpage components & effectively navigate the page.
EXAMPLE: https://blueprynt.co/ --- a modal popup will come up, but you can "tab" thru the menu in the background.

ISSUE 2:
The content of the same popup changes (by itself) if the user lands on a page that requires a WooThemes Membership membership for access.
EXAMPLE: https://blueprynt.co/blunick-profile/ --- the static text in the popup is automatically replaced by the message from the Woo Memberships plugin; ...its nice, but not what I'd expect to happen

CONTEXT:
We're using your plugin to create a popup that cannot be dismissed by the user & prevents interaction with the site (will eventually use this to force users to login before entering the site). I've added the following CSS to remove the "X" button from popups:
.wdpu-msg a.wdpu-close {
display: none !important;
}
SOFTWARE ENV:
Avada Theme, WooCommerce, Woo Memberships plugin, Woo Social Login plugin, and others

Many Thanks,
Ahsan

    Tyler Postle

    Hey Ahsan,

    Hope you're doing well today!

    ISSUE 1:
    We don't want the user to be able to interact with the website when certain modal popups are displayed. In my situation however, even with a modal popup on the screen, the user is able to tab thru the menu (using the TAB key) & other webpage components & effectively navigate the page.

    With the way PopUp works, I'm not sure we will be able to block the use of tabbing through the site while it's active. I'm going to flag one of our coding experts here to have a look at whether this is possible or not and provide some guidance if it is

    ISSUE 2:
    The content of the same popup changes (by itself) if the user lands on a page that requires a WooThemes Membership membership for access.
    EXAMPLE: https://blueprynt.co/blunick-profile/ --- the static text in the popup is automatically replaced by the message from the Woo Memberships plugin; ...its nice, but not what I'd expect to happen

    This shouldn't be happening. Would you mind sending in a copy of Woo's Membership plugin directly to me so I can troubleshoot if further? You can send this directly to contact[at]wpmudev.org - make the subject line: "Attn: Tyler Postle". This ensures that it gets assigned to me

    Look forward to hearing back!

    Cheers,
    Tyler

    PS. Welcome to the WPMU DEV Community!

    Tyler Postle

    Hey Ahsan,

    Sorry for the delay here. I just chatted with the dev assigned to this and they mentioned this is actually behaviour that is allowed by your theme, Avada. If we can intercept the event that's allowing it then we should be able to provide a quick snippet for you to change the behaviour; however, if there isn't a way to intercept the event then you will need to ask the Avada developers as it will require changing code in the theme itself.

    Would you be able to send us a copy of the theme so we can check and see if we're able to intercept the event?

    You can send it directly to contact[at]wpmudev.org - make the subject line "Attn: Tyler Postle". This ensures it gets assigned to me.

    Look forward to hearing back!

    Cheers,
    Tyler

    Tyler Postle

    Hey Ahsan,

    Sorry for the delay on this. I spoke with our developer and you can add this code to your themes functions.php file or as an mu-plugin:

    add_action( 'wp_footer', 'prevent_tab_key' );
    function prevent_tab_key() {
        ?>
        <script type="text/javascript">
            jQuery(document).keydown(function(objEvent) {
                if (objEvent.keyCode == 9) {  //tab pressed
                    objEvent.preventDefault(); // stops its action
                }
            })
        </script>
        <?php
    }

    For convenience, if you would like to add it as an mu-plugin then I've attached the zipped up file. Just upload that file to:

    /wp-content/mu-plugins/

    If the mu-plugins folder doesn't exist you an just create it inside the wp-content folder.

    Hope that helps and let us know if you have any further questions.

    All the best,
    Tyler