jiminee

When mousing over the item on the list the mouse pointer arrow changes to an "I". Is there a better, perhaps standard icon/arrow/pointer to change the arrow to or perhaps is it just better to keep it as an arrow and have the text change color or size?

Good question. Maybe an arrow is best (CSS "cursor: default"), since form buttons (that work in a similar way to a javascript menu) use that. I don't think "cursor: pointer" is a good choice, since the user may think it's a clickable link.

Another problem is how to make the user know the list items should be hovered in the first place...

Yet another problem: with a vertical list it's hard to avoid triggering the last list item when you move the mouse down to click the content's link. This can be avoided by making the list items appear in a horizontal row, but maybe it's better to not use a list in the first place, or use onclick events instead of onmouseover...

The pointer changing into a cursor makes me think there's something that can be edited. A question mark maybe?

You can limit the width of the list so hover isn't triggered all the way across the page.

Pointer is already a cursor.

Don't your form fields get the I-beam ("cursor: text") while form buttons get the arrow ("cursor: default")?

Yes and I don't think it should be. Oh, you mean I said it's changing? I meant in contrast to the surrounding links, when you sweep over the page with the mouse pointer.



But these aren't form fields. Neither are they normal text.

What else should it be but a cursor? Note that I'm talking about the cursor that looks like a hand ("cursor: pointer").


No you wrote that you thought things could be edited, which confused me since all my browsers except Opera display "cursor: text" both for plain text and form text fields (Opera uses "cursor: default" for both).

Obviously text among links will make a cursor change from "pointer" to say "text", that's what always happens with plain text among links. But I agree it would be strange if the OP's mouseover text looked like links while lacking a real link's cursor. The latter reminds me of an inexperienced computer user I know, that recently mistook a "helpful" tooltip (styled with a dashed bottom border and "cursor: help") for a link and tried in vain to make something happen when he clicked it.


You wrote it made you think something could be edited (like a text field?), which I thought was strange since "cursor: default" is not what I get for text fields.

I do think mouseover effects tend to behave more similar to form buttons than to links, form fields or plain text, so using the same cursor as for buttons doesn't seem too bad.

We use different words for the same things. The glyph you call I-beam I call cursor because I guess it's meant to look like the cursor, or caret if you will. I mean the one that's blinking to mark out the location you're at when you type. What you call cursor I call mouse pointer, the thing that moves as you move the mouse. I learnt it this way and it sort of stuck. I know CSS terminology is different (and therefor somewhat confusing - the cursor property should have been called pointer, I think).

Anyway, what I'm trying to say is that the default "cursor" isn't a good choice when the text is more than text, when something happens when you hover it.

Yes wikipedia seems to agree:

'On modern systems the default mouse cursor is an arrow pointing up and to the left, and is called the "mouse pointer".'

and here:

'In graphical user interface terminology, caret sometimes refers to a text insertion point indicator, often a blinking vertical bar. In this context, it may be used interchangeably with the word cursor.'

The cursor that looks like an I-beam? Maybe not. But what can we use for a "hover cursor"? It shouldn't be confused with something clickable. How about changing the background color of the hovered text instead of using a cursor? Or perhaps use the crosshair cursor? In any case the "hoverable" text should be styled as such from the start, without looking clickable, but I don't know how. Of course the whole idea of showing hidden content by hovering another part of the page tends to reduce usability...

OT: What's slightly confusing in browsers is that there's one cursor used for links (looking like a hand) and another for form buttons (looking like an arrow). Seems Google uses a hand cursor for its submit buttons, but only on the regular search pages --in the Advanced search pages and Preferences you get an arrow.

Not really. I don't know if this is right or wrong, but the way I learnt it, the big point is that the cursor (caret) and the mouse pointer are two different entities. The cursor is there either you have a mouse or not and the mouse pointer moves independent of a the cursor.

Anyway, I confused things by calling what CSS calls 'cursor: default' plainly "cursor", then I probably made it worse when I tried to explain why I did. I should at least have said "cursor-like glyph" or something. What I meant was the mouse pointer that resembles a caret, an I-beam to you.



A question mark.




Haven't thought about that.