bryankaraffa

Map fails to refresh and onClick events are not recognized on mobile phone.

Discussion created by bryankaraffa on Mar 19, 2013
I am working to make our map user interface into a responsive design and we've designed how we want to do it but have encountered a major issue along the way..

Web URL:  http://map.geog.ucsb.edu/

For our mobile version, we have a sidebar that can be open/closed depending on the users preference.  The map functions perfectly on load when loaded from a desktop browser or a mobile browser.  Users can zoom in/out and click on features to bring up the infowindow. 

The issue:  The issue only happens on mobile mobile device browsers - confirmed in Chrome and Safari running on iPhone 4 (iOS 4), iPhone 5 (iOS6), and Nexus 7 (4.2.1).  When a user clicks the "Hide Menu" button on the left side the map will no longer zoom / refresh normally and onClick events on the map are not recognized.  If the user reloads the page and tries zooming/clicking on features WITHOUT selecting anything else, the map works as intended until an element other than the map is focused, then the bug "happens.".


I do not know where to start with this issue and would appreciate any help if possible!

Thanks in advance!!!

Outcomes