I'm using custom divIcons for my Leaflet markers. I want to add a border to whatever marker I click on, with some simple CSS:
.selectedMarker {
border: 10px solid gold;
}
However, the following with jQuery doesn't work:
$(marker).addClass('selectedMarker');
Then I tried to use Leaflet's own addClass() method . I tried to call use it in the following ways:
marker.addClass('selectedMarker');
L.addClass(marker, 'selectedMarker');
addClass(marker, 'selectedMarker');
DomUtil.addClass(marker, 'selectedMarker');
None of these work. How do I add the selectedMarker class to my marker?
I have done it by adding a class to the marker with
var marker = L.marker(loc);
marker.on('click', function() {
$(marker._icon).addClass('selectedMarker');
}
and then use the css
.leaflet-marker-icon.selectedMarker{
//your css
}
In 1.0 and 0.7 you can use L.DomUtil to add remove classes from a DOM element:
L.DomUtil.addClass(marker._icon, 'className');
L.DomUtil.removeClass(marker._icon, 'className');
不使用jQuery,
marker._icon.classList.add("className");
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.