Possible Duplicate:
How to show a popup on mouse-over, not on click?

I'm working with Leaflet library. I defined L.layerGroup and add some markers to the group. Can somebody help me with mouseover function on markers. I need to get function which will open popup when user mouseover on marker. How to write code for that function considering this coding I wrote? I'm new with Javascript so please consider that.


var cities = new L.layerGroup();

var city1 = new L.marker([35.896667,14.4625], {icon: myIcon} ).addTo(cities);
var city2 = new L.marker([35.882222,14.522222], {icon: myIcon} ).addTo(cities);
var city3 = new L.marker([35.840854,14.484347], {icon: myIcon} ).addTo(cities);

1 Answer 1


You need to set a listener for the mouseover event. The markers page lists a "mouseover" event, and the events page shows how to configure a listener. So the code will be something like:

city1.on('mouseover', function(e) {
  //open popup;
  var popup = L.popup()
    .setLatLng(e.latlng) //(assuming e.latlng returns the coordinates of the event)
    .setContent('<p>Hello world!<br />This is a nice popup.</p>')

(Note that I haven't actually tested that, so view it as pseudo-code)



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