Legacy
Mapbox.js is no longer in active development. To learn more about our newer mapping tools see Mapbox GL JS.
You are viewing an older version of Mapbox.js. Check out v3.3.1 for the latest.
Mobile
Mapbox.js is optimized for mobile devices and small screens by default. There are, however, best practices to make sure your map always looks its best.
Viewport
Modern mobile browsers now support scaling of webpages by leveraging the meta
tag viewport
. This enlarges the window making your map look better on a
mobile device. Simply include this in the head of your document:
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' />
Scrolling
If you're planning on having a page that has large amounts of scrolling,
try to avoid a large map height. Having a 'tall' map can cause the user
to get stuck on the map while scrolling. Another way around this is to disable
dragging
for mobile devices: map.dragging.disable();