Google MyMaps Embed acts up on mobile

koskimaa · March 23, 2018, 11:35am

Here is a video that shows the problem:

Basically in the Google MyMaps embed window, when you open a location and then tap the back button in the top-left corner it shoves you to the bottom of the page for some reason.

The strange jump happens on mobile (iOS iPhone Safari), tablet (iOS iPad Safari) but not on desktop.

Could it be my way of embedding it that’s wrong?

Live site: http://urakashi.webflow.io

Here is my site Read-Only: https://preview.webflow.com/preview/urakashi?preview=e2b524bc23494dbc10fab881d19a8176

koskimaa · March 27, 2018, 12:18pm

Has anyone got any ideas? Or know somewhere (like a google expert forum) that I can ask?

jorn · March 27, 2018, 1:58pm

Try adding this code to the page or site

<style>
    html, body {
        height: 100%;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }
</style>

It worked on my testsite for this issue.
http://google-my-maps-test.webflow.io

Found this question over at product forums
https://productforums.google.com/forum/#!topic/maps/TLjqDaqX73M

And he linked to a question at Stackoverflow

Hope it helps John

When I visit Japan you owe me a sake

vikaskundu · April 1, 2018, 10:07am

It works just fine for me, thank you so much for the solution Jorn

Vikas Kundu
https://showbox.onl/ https://mobdro.onl/ https://dltutuapp.com/

koskimaa · March 28, 2018, 2:37pm

Thank you so much for researching this for me, Jörn. However it didn’t work on my site

I pasted the code in the head of my site, but for some reason it kills all my embed code and interactions on mobile… (not on desktop though)

Check here:

EDIT: Super frustrating since it does indeed seem to solve the problem on your test page, @jorn

jorn · March 28, 2018, 2:49pm

No problem John. Your site works for me on iPad now. But the map doesn’t load on my phone.

koskimaa · March 28, 2018, 4:49pm

Thanks again

I don’t have any iPad to test with, but interesting to hear that it works there…

@Brando do you have any idea why adding the code above kills all my embeds and interactions on mobile for http://urakashi.webflow.io ? (testing on iPhone)

EDIT: Actually, now when I take a closer look it actually screws with all of the scroll interactions on desktop as well. Tested with Safari.

peter011 · October 15, 2018, 2:12pm

Much thanks to you such a great amount for examining this for me, Jörn. Anyway it didn’t take a shot at my site :befuddled:

I glued the code in the leader of my site, however for reasons unknown it executes all my install code and connections on versatile.

Regards

jorn · January 8, 2019, 1:13pm

Glad I could help and its working for you

jorn · January 25, 2019, 10:54am

That’s a Wordpress site you have there. FYI this is a forum for Webflow sites. It could be other plugins you have or custom code on your site that interfere with the code. Hard to help you with WP sites on this forum.