[GIS] Collapsable control in Leaflet

leaflet

A simple to ask but difficult to answer question:

I want to create a control like the one in the Leaflet layers example:

http://leafletjs.com/examples/layers-control.html

Notice that the control is a small button, until pressed. When pressed, it expands, and shows all options. I can't find anywhere in the documentation on how this was implemented, or how I can copy this behaviour. Does anyone have any idea?

Best Answer

You mean it expands when hovering (not pressed) ...

There is no documentation but you can read the code here: https://github.com/Leaflet/Leaflet/blob/master/src/control/Control.Layers.js

Note in line 70

if (!L.Browser.android) {
                L.DomEvent.on(container, {
                    mouseenter: this._expand,
                    mouseleave: this._collapse
                }, this);
            }

And at the end of the file

_expand: function () {
    L.DomUtil.addClass(this._container, 'leaflet-control-layers-expanded');
},

_collapse: function () {
    L.DomUtil.removeClass(this._container, 'leaflet-control-layers-expanded');
}
Related Question