How do I make my MapboxGeocoder collapse when not on hover? I am trying to make it like this example (be sure to add your access token to the end), where the Geocoder search field expands when it's hovered. I was thinking it might require changing some CSS, but I don't know what to do to achieve that.

Here's my geocoder control:

map.addControl(new MapboxGeocoder({accessToken: mapboxgl.accessToken,mapboxgl: mapboxgl}), 'top-left');

1 Answer 1


If you look at the docs of mapbox-gl-geocoder plugin, there is collapsed option just for that.

So code could then look something like this:

  new MapboxGeocoder({
    accessToken: mapboxgl.accessToken,
    mapboxgl: mapboxgl,
    collapsed: true

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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