the default zoom [+/-] button is always on top

[Jean-Luc Menut]

Hello,

I'm quite new to javascript so maybe the solution is obvious but when I include a leaflet map on a page, the default [+/-] controlling the zoom of the map is always displayed on top of any other element of the page. Especially I have a menu on the left of the map which is overlaping the map when opened, and the menu item are under this button. Is there any way to solve that ?

Thank you very much

[Iván Sánchez Ortega]

On Monday, 15 June 2015 10:56:15 UTC+2, Jean-Luc Menut wrote:

I'm quite new to javascript so maybe the solution is obvious but when I include a leaflet map on a page, the default [+/-] controlling the zoom of the map is always displayed on top of any other element of the page. Especially I have a menu on the left of the map which is overlaping the map when opened, and the menu item are under this button. Is there any way to solve that ?

The containers for leaflet controls have a Z-index of 1000 (see https://github.com/Leaflet/Leaflet/blob/stable/dist/leaflet.css#L89 ). Try setting a higher z-index for your drop-down menus, and also read up about stacking contexts: https://developer.mozilla.org/docs/Web/Guide/CSS/Understanding_z_index/The_stacking_context

[Jean-Luc Menut]

Thank a lot, it works !

> --
>
> ---
> You received this message because you are subscribed to a topic in the
> Google Groups "Leaflet" group.
> To unsubscribe from this topic, visit
> https://groups.google.com/d/topic/leaflet-js/stocRSjO_sI/unsubscribe.
> To unsubscribe from this group and all its topics, send an email to
> leaflet-js+...@googlegroups.com.
> For more options, visit https://groups.google.com/d/optout.

[Bryan McBride]

Alternatively, you could set zoomControl: false to hide the zoom control from the map. If you want the zoom control in a different location, you could hide it initially and then add it back, defining the position:

map = L.map("map", { zoomControl: false,

... });

var zoomControl = L.control.zoom({
  position: "bottomright"
}).addTo(map);

-Bryan

[Jean-Luc Menut]

thanks !