CODEWITHSUNDEEP
openlayers-3
Poul K. Sørensen
Poul K. Sørensen

Reputation: 17530

Changing cursor on drag in openlayers 3

What are the proper way of changing the cursor when user is dragging the map. Below example is not that good as it only triggers when pointerdrag starts the drag and then change it back after no events for 125ms. Is there any other way?

    var timer = null;
    this.map().on("pointerdrag",() => {
        this.map().getViewport().style.cursor = "-webkit-grabbing";
        clearTimeout(timer);
        timer = setTimeout(() => this.map().getViewport().style.cursor = "-webkit-grab", 125); 
    });

Upvotes: 2

Views: 2282

Answers (1)

tsauerwein
tsauerwein

Reputation: 6011

What about listening to pointerup to reset the cursor?

map.getViewport().style.cursor = "-webkit-grab";
map.on('pointerdrag', function(evt) {
    map.getViewport().style.cursor = "-webkit-grabbing";
});

map.on('pointerup', function(evt) {
    map.getViewport().style.cursor = "-webkit-grab";
});

http://jsfiddle.net/9vwgdcyr/

Upvotes: 5

Related Questions