Cursors option does not allow for browser specific options

[davesag]

CSS3 allows a range of new cursor styles, and in particular I want to show the standard 'hand' cursor when the user is just moving the mouse around, and switch to the 'grabbing hand' cursor when the map is being panned.

I tried adding the following code:

cursors: {
  static: "move",
  pan: "-webkit-grabbing, -moz-grabbing"
},

but that just gave me a default 'arrow head' cursor.

Adding this instead

cursors: {
  static: "move",
  pan: "-webkit-grabbing"
},

gives me the grabbing hand in Safari and Chrome (which is better than nothing I guess) but it shows that cursor all the time, not just when the map is being panned around. I expected the 'static' cursor to show when the map is not moving but I suppose that will only show when the map is set to 'static' mode.

Please enhance the cursors options to allow for more, and cross browser, cursor options.

Also I'd like the cursor to change when the user mouses over one of the appended map pins. I've tried adding cursor: "pointer"; to the various bits of CSS that get triggered but it seems to be overridden by the Geo code. Any suggestions for this?

Cheers

Dave

[ryanttb]

1/3 of this is easy. To have the cursor change as the user pans the map, you need a custom mode with its own cursor and then change the pan cursor to the webkit one.

http://jsfiddle.net/ryanttb/sqBP5/

2/3: I don't know why you can't use multiple cursors, as far as I remember, I'm just setting the cursor property via jQuery's css method, something like: this._eventTarget.css("cursor", this._options.cursors[this._options.mode]). A fiddle testing just jQuery's css method on the cursor property would be great!

3/3: The map is currently designed to handle all interaction with shapes in the map, we do some spatial indexing and will do a lot more in future versions. To change the cursor on mouse over a shape, you would use the move event, the find method, and set the cursor option appropriately. It sounds like a lot of work, and it is, but not horrible. Let me know if this fiddle helps with a couple of your questions:

http://jsfiddle.net/ryanttb/3Fp4E/

[davesag]

1. Thanks that was just what I was looking for. It's not clear in the documentation that you need to associate your own mode with a cursor type.
2. I'll do that but it takes a lower priority than the other two.
3. Thanks, that looks reasonable.

[ryanttb]

I think we covered the (and other issues) but leaving this open so I can test the original cursors issue.

[ryanttb]

Hi @davesag , I've finally took a look into the original cursor issue from the very top and I don't think there's much I can do. Applying cursor fallbacks via JavaScript seems out of the question, even though it's perfectly easy in CSS: http://jsfiddle.net/ryanttb/2ndqa/

If you happen to still be interested, you can keep track of the mode for which you want the grabbing cursor and add/remove a CSS class on the (non-public) div with the class .geo-event-target.

You can check this out for an example: http://jsfiddle.net/ryanttb/MVdQr/1/

However, I'm going to have to close this issue as I don't think it's something I can or should tackle in the library itself.