Mobile site requires page reload to display maps

[sgauder]

Have MapPress working nicely on a desktop version of a site but when viewing the site on a mobile device, the pages need to be reloaded before the maps appear.

I’m using a mobile device detector to switch to the mobile theme – not sure if that’s causing the issue.

Development site is here http://cmswebsolutions2.com/farmfresh. I don’t think this is the same issue that’s referred to in the FAQ – I can see the map with 2 loading gifs.

Any ideas what may be happening?

[Chris]

Hi, I see the issue (only on a phone) but it’s tough to say what the cause might be.  The issue in the FAQ occurs only when the map container is initially hidden.

Could you try switching to the standard twentyeleven theme for starters, to see there’s a conflict?  I’d suggest deactivating ALL plugins as well, in case there’s a javascript error from another plugin.

If that doesn’t work, is it possible to enable the mobile theme on a test page, so I can trace it in a normal web browser (it’s tougher to debug from the phone).

[sgauder]

So, I switched the mobile theme to TwentyEleven and the maps worked fine.  Switched back to my mobile theme AND disabled jquery mobile script – maps work fine.  As soon as I add jquery mobile back in I get the same issue again.  Just not sure why jquery mobile is conflicting with the plugin – not sure how to diagnose.

Welcome your suggestions.

[Chris]

Hi,

Could you provide a test URL that is permanently set to the mobile theme with jquery mobile loaded (so I can test it from a desktop)?

I briefly browsed through the jquery mobile forums and it appears others were having trouble with this as well, for example:

http://forum.jquery.com/topic/google-maps-inside-jquery-mobile

They may have been confusing the Google issue with displaying maps in an initially hidden container, but if you’re a javascript developer, you can try triggering the map resize event like this (assuming the map is named ‘mapp0’ – see the FAQ for some info about map names):

mapp0.resize();

 

[Author]

Posts