宣传单 - 如何更改抓取手形光标？

Question

我可能忽略了如何在地图上更改LeftletJS的光标。 http://leafletjs.com/reference.htm

我尝试过设置map_div.style.cursor = 'crosshair'; - 这适用于其他元素，但不适用于地图div。我认为这是因为Leaflet以某种方式覆盖它。

我希望能够切换到＆＃34;十字准线＆＃34;使用Javascript（和返回）游标。

这可能吗？

更新：我没有jQuery。

Answer 1

您只需要覆盖Leaflet的光标样式。以下示例覆盖默认光标：

.leaflet-grab {cursor: auto;}

当你拖动地图时，这个会改变光标：

.leaflet-dragging .leaflet-grab {cursor: move;}

实时样本：https://tympanus.net/codrops/2012/04/09/direction-aware-hover-effect-with-css3-and-jquery/

Answer 2

您无法覆盖，因为该对象没有支持：

解决方案---创建地图后使用

JQuery的

$('.leaflet-container').css('cursor','crosshair');

或

的JavaScript

document.getElementById('map').style.cursor = 'crosshair'
document.getElementById('map').style.cursor = '' //(reset)

您也可以使用此事件更改鼠标：

map_div.on('mousedown', function (e) {})

Answer 3

另一种方法是have a look at Leaflet's CSS，查看定义光标形状的规则，并覆盖这些CSS规则。