Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I'm working with the Leaflet JavaScript Library and attached a (working) map to my HTML Document. It is in the middle of the page, and when I'm scrolling down with my mouse wheel and arrive at the map, it automatically zooms into the map.

I want to scroll through the page without stopping at the map. Is there a way to activate the wheel zoom only after the first click on the map?

share|improve this question
up vote 13 down vote accepted

It's simple: create L.Map with scrollWheelZoom: false option, then add a listener:

map.once('focus', function() { map.scrollWheelZoom.enable(); });

If you need to toggle zooming:

map.on('click', function() {
  if (map.scrollWheelZoom.enabled()) {
    else {
share|improve this answer
Thanks! A very fast, short and right answer :) – Jandroide Aug 27 '14 at 10:54

Leaflet.Sleep will make your job easy, and it's plenty configurable

Basically, it turns off scroll events when they're not needed and "wakes" your map when they are.

I'd post code, but the defaults seem to get it right, so you likely won't need anything beyond <script src="path/to/leaflet-sleep.js"></script> and you'll have a map like this.

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.