We use cookies to ensure that we give you the best experience on our website. If you continue to use this site we will assume that you are happy with it.

Ok, I Agree

Refresh / reload page on click

Home › Forums › Programming › Refresh / reload page on click

Tagged: ,

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • 2022-10-05 at 6:35 pm #56410
    Mariusz
    Customer

    Hi,
    I need to refresh the page after the user changes the orientation of the mobile device. This needs to be done because the different interface is designed for landscape and portrait. I created the interface in Webflow.

    I’m trying to do it with the script (the puzzle configuration is in the attachment):

    window.location.reload(true);

    but it reloads the html_embed window only (so only the Verge application), but the elements added via Webflow stay the same.

    How should I configure this code to reload the whole page including the app embed and the Webflow elements?

    Attachments:
    You must be logged in to view attached files.
    2022-10-05 at 9:03 pm #56418
    kdv
    Participant

    parent.window.location.reload();

    but it’s a cruel solution to reload the whole page: one awkward move and ooops ))) can’t you just hide/show interfaces on the window resizing?

    Puzzles and JS coding. Fast and expensive.

    If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of the meaning at all.

    2022-10-06 at 6:59 am #56420
    Mariusz
    Customer

    Thank you, it worked! :good:

    Yeah, I know. If I could, I would prefer to avoid refreshing the website. I have to do it for two reasons:

    1. As mentioned above, when the user rotates the device, the interface made in Webflow still displays the version made for the previous orientation. And because those two versions are veeeeery different, it makes the application impossible to use.

    2. Here is an even worse thing: the biggest smartphones have wider screens in landscape orientation than the smallest tablets in portrait. Since the breakpoints in Webflow depend on the screen resolution and not on the orientation, it results in smartphones in landscape orientation taking tablet interface which, again, makes it impossible to use. So I decided to add information like “rotate your device to use the application” after the page is reloaded. Probably I could do it without reloading the page on mobile, but on tablets, I still have problem no.1.

    So yeah… :)

    2022-10-14 at 6:02 am #56626
    Mariusz
    Customer

    I’ve just found a better solution to the problem that I had. I managed to display the “rotate the device window” message for the user when he rotates the mobile device to landscape and I want him to stay in portrait. It’s a kind of workaround. ;-) I’m leaving it here in case someone will need it in the future.

    The reason for this workaround is that resizing the window from the example above was working also in a case where the user uses the “input” field to enter some text – the window was resized on mobile because the keyboard appeared and the website got refreshed, which was wrong in this situation.

    To make the workaround:
    1. We need to create a div with the message. In my setup, it has an ID “rotate device”.
    2. We need to set up the procedure for checking the screen orientation (it was explained by Soft8Soft in a few places on the forum).
    3. We need to set up “on event” for resizing the window.

    Attachments:
    You must be logged in to view attached files.
  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.