MapBox scroll page on touch

Yes, you can stop the Mapbox listeners from preventing default actions by setting the leaflet function to do nothing:

L.DomEvent.preventDefault = function(e) {return;}

To remove the outline placed around the element by the browser that otherwise would have been prevented, you can add:

*:focus {
  outline: none;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0); 
  -webkit-focus-ring-color: rgba(255, 255, 255, 0) !important; 
}

This allowed scrolling on touch devices for me, though I've only tested on Android. Note that this may have other consequences on your application - these could probably be prevented by going into mapbox.js and removing this call from only the listeners that you need.


This example has been improved: the line that was missing is:

if (map.tap) map.tap.disable();

This will prevent the map from killing tap events on touch devices.


Remove the rest of the listeners as in this example - the one you probably still have is dragging.