When working on mobile I want the ability to navigate to a new page with transitions but also I want to be able to set the transition to what size of the screen the new page will take up in space. So when I click my button I have setup transition from left to right but I also configured this page transition to 90% of screen.
The new page will overlay the page with 90% as in the below screenshot and when navigating away it will load a new page over it or if I click a close button I can choose to reverse transition or just tell the page to pop itself and it will reverse transition and go away.
This feature would be awesome for making awesome mobile UX.
If making this possible we could use it as dynamic menus, booking forms, chats or support windows or in any other way. It would extend the UX experience on mobile quadruple.
Have you tried the lightbox feature? It sounds a lot like what you’re describing. If not, can you highlight the difference?
But they dont work on mobile
Sorry but they do work but they don’t animate in and that is what the client requests
And another question, they only want it on mobile not on desktop.
Regarding the lightbox, it can be opened by linkable element (button, image, text) or code. If you make them only apparent in mobile (in code you do it by checking the formFactor and then openLightbox ). Regarding animations, they are currently disabled on mobile, but it is being re-reviewed
Okey, so I add the button, add the lightbox. In code on document readu I check the formFactor if it is mobile and then open the lightbox window? That would do it, then we can add the animations later when you decide to re-release it. I would be happy enough if page transitions and lightbox transitions where enabled. All other animations are not crucial on mobile.
Sounds great. Another way you can do is to have a button that opens the lightbox (configure it using the button link panel). In the document onReady hide the button if it desktop. That way you have a button opening the lightbox (that is used as a menu), but it appears only on the mobile view (and in desktop view there’s no way of getting to the lightbox)
Do you load the hidden objects and then hide them. I some cases I can see the button and then it disappears when the page is fully loaded?
If you hide in the onReady event it shouldn’t appear and disappear. It might happen to you when you’re in the editor, because it was already loaded and presented there. It should not happen in the published site
