1

I want to change the mouse cursor into a hand icon when I select to pan. I have tried this code:

map.addControl(new OpenLayers.Control.PanZoomBar());
map.addControl(new OpenLayers.Control.MouseToolbar());
map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false}));
map.addControl(new OpenLayers.Control.Permalink());
map.addControl(new OpenLayers.Control.Permalink('permalink'));
map.addControl(new OpenLayers.Control.MousePosition());
map.addControl(new OpenLayers.Control.OverviewMap());
map.addControl(new OpenLayers.Control.KeyboardDefaults());
map.addControl(new OpenLayers.Control.Dragpan());
map.addControl(new OpenLayers.Control.Pan());
map.addControl(new OpenLayers.Control.PanPanel());

OpenLayers.Control.DragPan = OpenLayers.Class(OpenLayers.Control, {
type: OpenLayers.Control.TYPE_TOOL,
panned: false,
interval: 25,
documentDrag: false,
draw: function() {

this.handler = new OpenLayers.Handler.Drag(this, {     
                "move": this.panMap,     
                "done": this.panMapDone     
            }, {     
                interval: this.interval,     
                documentDrag: this.documentDrag     
            }     
        );     
    },     
panMap: function(xy) {     
        this.panned = true;     
        this.map.pan(     
            this.handler.last.x - xy.x,     
            this.handler.last.y - xy.y,     
            {dragging: this.handler.dragging, animate: false}     
        );     
    },
 panMapDone: function(xy) {     
        if(this.panned) {     
            this.panMap(xy);     
            this.panned = false;     
        }     
    },     

    CLASS_NAME: "OpenLayers.Control.DragPan"     
}); 
map.addControl(control);
2

You may use the setMousePointerSwitcher() function, see example code in link below:

function setMousePointerSwitcher() { var panelControls = map.getControlsBy('div', $('basic-controls'))[0].controls; for (var i = 0; i < panelControls.length; i = i + 1) { var c = panelControls[i]; c.events.register('activate', c, function() { mousePointerStyle = MOUSE_POINTER_STYLES[this.CLASS_NAME]; }); }

// Change mouse pointer style when it is over the map area.
$('map').observe('mouseover', function() {
    document.body.style.cursor = mousePointerStyle;
});

// When not over the map area, mouse pointer style 
// is the default one.
$('map').observe('mouseout', function() {
    document.body.style.cursor = 'default';
}); }

Changing mouse pointer style in OpenLayers

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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