Для получения полного доступа
зарегистрируйтесь.
Snippet,  JavaScript

Disable Mapbox or Leaflet map zooming while page scrolling but still allow it


It's totally irritating when you have Mapbox or Leaflet map on a long long page. When you're scrolling map comes into the view it is starting to zoom map out instead of scrolling the page.

It could be fixed by requiring three second hover over the map before it could be scrolled.

var map = L.mapbox.map('mymap', 'mymap');

// disable scroll-zooming initially
map.scrollWheelZoom.disable();

var zoomTimer;

// on entering the map we're starting a timer to
// 3 seconds after which we'll enable scroll-zooming
map.on('mouseover', function() {
	zoomTimer = setTimeout(function(){
		map.scrollWheelZoom.enable();
    }, 3000);
});

// on leaving the map we're disarming not yet triggered timers
// and disabling scrolling
map.on('mouseout', function() {
    clearTimeout(zoomTimer);
    map.scrollWheelZoom.disable();
});

  scroll leaflet mapbox

Автор


samdark
  • Reputation: 348
  • Snippets : 57
  • Revisions : 5
Подписаться

Чтобы увидеть комментарии, нужно быть участником сообщества

Регистрация