-
Posts
-
Hello, need a popup with text and pictures. Followed the treat https://kriesi.at/support/topic/open-popup-modal-with-button/ and works fine on my desktop. but on my mobile the page scrolls up to the top and the popup is in the middle of my page instead of my screen (use a iPhone) so it’s not visible
directly but only when you scroll downis this a common problem or does I do something wrong?
try to give to the link that initiates the modal window a custom-class ( has to go to the anchor itself ) : no-scroll
PS: pay attention that is a very old topic – in the meanwhile we got jQuery 3.5.1 –
the codejQuery(window).load(function(){is deprecated
and you had to use instead:$(window).on('load', function(){Hi,
Try preventing the page from scrolling with the lightbox popup by trying this solutionBest regards,
Mikeyou are reffering to a page ( you link above https://kriesi.at/support/topic/open-popup-modal-with-button/ ) – there are several snippets – but this is an older topic – you have to replace that line with mine – not to replace the whole code . This is mikes link to Ismaels Post . You see that here is the setting of no-scroll class on the initiating anchor. And you see that there is window on load.
___________
Some info on that.
So you have placed a hidden code block on the page. That codeblock got an unique ID – and an anchor is linking to that ID.
How would a (non-lightbox) link to an ID on the same page behave?
You click it, and it scrolls to the anchor there.
The trick with this modal window is that the html code is inside a code block. Nevertheless, the code block is in a place inside your DOM. So if this codeblock is at the bottom – the modalwindow opens, but still the window scrolls to the place where the codeblock is in the layout. This can be prevented in Enfold, by setting the class no-scoll to that link.The fact that the background no longer moves with the scroll when the lightbox is open has become standard – or so I thought. (This is what Mike had recommended and belongs to the earlier solution to assign the property overflow-y: hidden to the html.
If you could please post your snippet here, then I can tell you better in this regard what to change.Hi,
Glad to hear we were able to help, but this was not my code, I believe the original thanks goes to Guenni007 in this thread or it was a collaboration with Ismael in a later post from the same thread 🙂
If you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.Best regards,
Mike
- The topic ‘open-popup-modal on mobile’ is closed to new replies.