js/css changing cursor

Question

I'm using css/js to change the class of an element which the pointer is hoving over. The class determines the custom cursor image.

Unfortunately, it seems as if the cursor does not update in Chrome unless I physically move the mouse. Unfortunately the app is primarily used through the keyboard, however the cursor image is pretty important.

Any way around this?

Thanks.

Not to be rude, but I'm really interested to learn under what circumstances a cursor *image* would be considered *important*. — animuson, Jul 04 '10 at 03:54
Why is the cursor image important if you aren't using the cursor? — ceejayoz, Jul 04 '10 at 03:55
@animuson Depending on how you want to provide user feedback, it may be considered very important. — George Marian, Jul 04 '10 at 03:55
@Geroge Marian: Couldn't he always just use the default cursors that always work? To me loading cursor images is irritating and just adds another object to load with the page. I've never come across a real reason to use one. I've always found the default ones to suit any needs. — animuson, Jul 04 '10 at 03:58
@animunson: I'd disagree with you - use of some of the default cursors that don't require image loads can be very handy. Sometimes you have an without a href but you want the pointer hand, or sometimes you want to make clear that you can drag and move something around. That being said, if you primarily use the keyboard, I agree I can't see why changing the look of the cursor, which may be nowhere near the item in question, would need to change — Mala, Jul 04 '10 at 04:04
Because I'm making an app rather than a website. The cursor doesn't indicate navigation, but other, custom, and important, things. — Mark, Jul 04 '10 at 04:04
@animuson Depends on what he's doing. He may have an element (say an image) which can clicked to trigger some action. He'd want to use the pointer cursor in order to let the user know that they can interact with the image. Yes, you *could* wrap in an anchor tag, but that's not necessarily desirable. — George Marian, Jul 04 '10 at 04:05
@Mala the cursor is in the main area of the screen, and always present. Keyboard and mouse use goes hand in hand in this app, with about 70% keyboard use for some users. Since the cursor indicates the current action, if it does not update upon keypress, it will indicate incorrect action, which is naturally, very bad. That is to say, even if the user learns to use the keyboard, the cursor is providing information on what the effect of the keyboard press may be. — Mark, Jul 04 '10 at 04:07
Thanks @George Marian and @Mala for understanding and being imaginative. :) — Mark, Jul 04 '10 at 04:10
@Mala @George Marian: I was under the impression that he was using actual cursor images, like a .cur file. When I see image, I think of an image, when I see cursor, I think of the default available cursors (default, pointer, crosshair, etc). — animuson, Jul 04 '10 at 04:14
@animuson I am using a .cur. My app is ~ 1 gig of streaming media content. Loading a <1kb img is not on my list of concerns. — Mark, Jul 04 '10 at 04:21

score 2 · Accepted Answer · edited May 23 '17 at 12:01

2

This is actually a documented bug in Chrome and Safari. See this question on StackOverflow:

Getting the browser cursor from "wait" to "auto" without the user moving the mouse

I think you're out of luck for now, sorry

edited May 23 '17 at 12:01

Community

1
1

answered Jul 04 '10 at 04:36

Mala

14,178
25
88
119

Thanks. Somehow I thought that was the correct behavior that I should work around. Did not occur to me that others might interpret it as a bug. Of course now I feel that that's a bug! Thanks. – Mark Jul 04 '10 at 04:46

js/css changing cursor

1 Answers1

Linked