Navigation
Archive / Pop up appearing behind picture
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • March 6, 2017 at 4:14 pm #1396861
    aperfect10
    Participant

    Hello! I have a pop-up on my landing page that is showing up behind my photo on a mobile phone. However, when viewed on a desktop it is fine.

    http://66.147.242.91/~aperfef8

    Thank you for your help!

    Kristi

    March 7, 2017 at 12:13 am #1397254
    Rupok
    Member

    Hi Kristi,

    Are you referring this pop up? – http://prntscr.com/egyx10

    It seems appearing fine. Are you referring any other pop up?

    Let us know.

    March 9, 2017 at 2:51 pm #1401041
    aperfect10
    Participant

    Hello!

    On my screen and our owner’s screen it is appearing behind the image. See attached photo.

    Thank you!

    Kristi

    March 9, 2017 at 3:20 pm #1401070
    aperfect10
    Participant
    This reply has been marked as private.
    March 9, 2017 at 10:10 pm #1401472
    Rupok
    Member

    Hi there,

    Still I can’t replicate the issue but you can try adding this under Custom > CSS in the Customizer.

    .cp-modal-popup-container {
    z-index: 99999;
}

    Let us know if that helps.

    March 10, 2017 at 10:48 am #1402073
    aperfect10
    Participant

    Hello!

    Still didn’t work. I’m not sure why it would be appearing correctly on a desktop version but differently on a cell phone.

    March 10, 2017 at 4:36 pm #1402420
    Nabeel A
    Moderator

    Hi again,

    Try replacing the previous code with the following code:

    .cp-overlay.cp-open .cp-modal {
    z-index: 99999 !important;
}

    Don’t forget to clear your browser’s cache after adding the code. Let us know how this goes!

    March 10, 2017 at 5:29 pm #1402458
    aperfect10
    Participant

    Still didn’t work. The pop-up is appearing behind the slider but in front of the text. Could it be something with my slider? But why would it be different from the desktop version to the mobile?

    March 11, 2017 at 1:43 am #1402827
    Rue Nel
    Moderator

    Hello There,

    Thanks for updating in! I am another staff checking on this thread. I have tested your site in 3 different mobile phone. I am seeing the same layout. All of them is displaying this:

    Please clear your mobile phone’s cache or use private browsing mode. If you have Mobile Chrome, please use incognito mode and test your site again.

    Please let us know how it goes.

    March 15, 2017 at 12:13 pm #1408327
    aperfect10
    Participant
    This reply has been marked as private.
    March 15, 2017 at 2:30 pm #1408488
    Joao
    Moderator

    Hi There,

    Another support here and I cannot replicate the issue.

    What Browser and device you are using while experiencing this?

    Please let us know

    Joao

    March 16, 2017 at 4:54 pm #1410208
    aperfect10
    Participant

    Hey Joao!

    I have used both Safari and Chrome on an iPhone 6 or newer. Our company owner is also experiencing the same issue on her iPhone 7 on Safari.

    March 17, 2017 at 4:38 am #1410840
    Rad
    Moderator

    Hi there,

    I can confirm this and looks like bug in iOS. I set the z-index to million but it still doesn’t work. The z-index has no effect to layer positioning. Setting negative z-index works, but that put the element behind the element and render it useless. Would you mind providing you login credentials? I like to disable some feature and test it on a temporary page.

    Thanks!

    March 21, 2017 at 3:18 pm #1415432
    aperfect10
    Participant
    This reply has been marked as private.
    March 22, 2017 at 3:52 pm #1416784
    Rad
    Moderator

    Hi there,

    The iOS has a problem with animation. I deactivated your ConvertPlug modal animation(under your modal settings) and your Layerslider’s slide effect when swiping (under slider mobile settings).

    It’s now displaying okay in iOS devices.

    Thanks!

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1396861 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>