By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
434,728 Members | 2,490 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 434,728 IT Pros & Developers. It's quick & easy.

Problem with cursor property

P: n/a
I am using the following class in a CSS document:

..loginsubmit
{ background-color: #ffffff; FONT-WEIGHT: bold; color: #002980; cursor:
hand }

It works perfectly well, but it won't validate in the W3C CSS validator
saying:

Invalid number : cursorhand is not a cursor value : hand

I need to change the cursor into a hand as when it goes over the submit
button without the "cursor: hand" part the cursor remains like that of
general text and the user might not know that they can click on the button.

Any suggestions as to what i should be using to get the pointer to look like
a hand as it hovers over a button?

Thanks,
--
Chris Michael
www.INTOmobiles.com
Free ringtones/logos
Free mobile alerts
3 months free insurance
Jul 20 '05 #1
Share this Question
Share on Google+
9 Replies


P: n/a
in post: <news:c5*************@ID-211081.news.uni-berlin.de>
"Chris Michael" <ne**@intomobiles.com> said:
Any suggestions as to what i should be using to get the pointer to look like
a hand as it hovers over a button?


cursor:pointer;

http://www.w3.org/TR/REC-CSS2/ui.html#cursor-props
--
b r u c i e
Jul 20 '05 #2

P: n/a
On Thu, 8 Apr 2004 15:42:16 +0100, Chris Michael <ne**@intomobiles.com>
wrote:
I am using the following class in a CSS document:

.loginsubmit
{ background-color: #ffffff; FONT-WEIGHT: bold; color: #002980; cursor:
hand }

It works perfectly well, but it won't validate in the W3C CSS validator
saying:

Invalid number : cursorhand is not a cursor value : hand
See http://www.w3.org/TR/CSS21/ui.html#propdef-cursor for proper cursor
values.
I need to change the cursor into a hand as when it goes over the submit
button without the "cursor: hand" part the cursor remains like that of
general text and the user might not know that they can click on the
button.

Any suggestions as to what i should be using to get the pointer to look
like
a hand as it hovers over a button?


Likely cursor: pointer; would do the trick...
Jul 20 '05 #3

P: n/a
Chris Michael wrote:
I am using the following class in a CSS document:

.loginsubmit
{ background-color: #ffffff; FONT-WEIGHT: bold; color: #002980; cursor:
hand }

It works perfectly well, but it won't validate in the W3C CSS validator
saying:

Invalid number : cursorhand is not a cursor value : hand
That's because 'hand' is a proprietary version of the standard property
value 'pointer'. When you are having trouble with validity, check the
specification:

<URL:http://www.w3.org/TR/REC-CSS2/ui.html#cursor-props>

I need to change the cursor into a hand as when it goes over the submit
button without the "cursor: hand" part the cursor remains like that of
general text and the user might not know that they can click on the
button.


Wouldn't a better approach be to leave it looking like a button, which is
instantly more recognisable, rather than making your visitors wave their
mouse around trying to find things to click on? Or at least style it like
the rest of your links (e.g. underline it)?
--
Jim Dabell

Jul 20 '05 #4

P: n/a
in post: <news:c5*************@ID-211081.news.uni-berlin.de>
"Chris Michael" <ne**@intomobiles.com> said:
I need to change the cursor into a hand as when it goes over the submit
button without the "cursor: hand" part the cursor remains like that of
general text and the user might not know that they can click on the button.


my brain didn't absorb the above until after i sent my first reply.

you don't need to change anything. the cursor changing to indicate a
link is not standard nor expected behavior on form buttons[1]. don't
confuse your visitors.

[1] that i'm aware of.

--
b r u c i e
Jul 20 '05 #5

P: n/a

"Chris Michael" <ne**@intomobiles.com> wrote in message
news:c5*************@ID-211081.news.uni-berlin.de...
I am using the following class in a CSS document:

.loginsubmit
{ background-color: #ffffff; FONT-WEIGHT: bold; color: #002980; cursor:
hand }

It works perfectly well, but it won't validate in the W3C CSS validator
saying:

Invalid number : cursorhand is not a cursor value : hand

I need to change the cursor into a hand as when it goes over the submit
button without the "cursor: hand" part the cursor remains like that of
general text and the user might not know that they can click on the

button.

If you wrote "cursor: nose;" would you expect the cursor to look like a
nose?

One valid value for the cursor property is "pointer", which in IE, at least
under some Windows UI "themes", happens to be an image of a hand. If the
usual appearance for a pointer-type cursor on some machines or OS's or
browsers is something other than a hand, that's not of concern to you.

Jul 20 '05 #6

P: n/a
"Chris Michael" <ne**@intomobiles.com> wrote in message
news:c5*************@ID-211081.news.uni-berlin.de
|| I am using the following class in a CSS document:
||
|| .loginsubmit
|| { background-color: #ffffff; FONT-WEIGHT: bold; color: #002980;
|| cursor: hand }
||
|| It works perfectly well, but it won't validate in the W3C CSS
|| validator saying:
||
|| Invalid number : cursorhand is not a cursor value : hand
||
|| I need to change the cursor into a hand as when it goes over the
|| submit button without the "cursor: hand" part the cursor remains
|| like that of general text and the user might not know that they can
|| click on the button.
||
|| Any suggestions as to what i should be using to get the pointer to
|| look like a hand as it hovers over a button?

Damn, that was quick!

Thanks for all your suggestions.

--
Chris Michael
www.INTOmobiles.com
Free ringtones/logos
Free mobile alerts
3 months free insurance
Jul 20 '05 #7

P: n/a
DU
brucie wrote:
in post: <news:c5*************@ID-211081.news.uni-berlin.de>
"Chris Michael" <ne**@intomobiles.com> said:

I need to change the cursor into a hand as when it goes over the submit
button without the "cursor: hand" part the cursor remains like that of
general text and the user might not know that they can click on the button.

my brain didn't absorb the above until after i sent my first reply.

you don't need to change anything. the cursor changing to indicate a
link is not standard


Agreed. But what about the type of link?

nor expected behavior on form buttons[1].

Agreed here too.

don't confuse your visitors.

[1] that i'm aware of.


But just for the sake of this thread, Brucie, would you be against a
modification in CSS3 User Interface to include cursors which would indicate
- an .exe file (download will be triggered): the cursor would be a hand
with a floppy disk on its right-bottom side.
- a mailto: format (the associated mail program would be called) or an
<address> element: the cursor would be a hand with an envelop on its
right-bottom side
- a target="_blank" (opening a new window): the cursor would be a hand
with a red arrow in its center trying to indicate the opening of a new
window. Now, this one would meet a guideline given by WAI:

"if your link spawns a new window, or causes another windows to "pop up"
on your display, or move the focus of the system to a new FRAME or
Window, then the nice thing to do is to tell the user that something
like that will happen."
http://www.w3.org/WAI/wcag-curric/sam77-0.htm

and also would definitively meet the spirit of a recommendation by J.
Nielsen

"Use link titles to provide users with a preview of where each link will
take them, before they have clicked on it."
Ten Good Deeds in Web Design
http://www.useit.com/alertbox/991003.html

Now, all of this is currently doable and possible in MSIE 6. There is an
MSIE 6 extension (creating a Site Navigation toolbar, just like in
Mozilla-based browsers and in Opera 7.x) that uses this.
You can see what I mean viewing this section with MSIE 6:

http://www10.brinkster.com/doctorunc...rs.html#Custom

DU
Jul 20 '05 #8

P: n/a
in post: <news:c5**********@news.eusc.inter.net>
DU <dr*******@hotWIPETHISmail.com> said:
But just for the sake of this thread, Brucie, would you
oh no, i think you've mistaken me for someone who has a clue.
be against a modification in CSS3 User Interface to include cursors
which would indicate
- an .exe file
- a mailto:
- a target="_blank"


what sort of checks and balances are going to be used to ensure that if
a cursor says its a mailto it really is and not a PPC link to some sicko
porn?

its a nice idea but open to waaay too much abuse which would make the
whole thing untrusted and annoying. browsers using it without author
control would be nice.

the little voices agree with me.
--
b r u c i e
Jul 20 '05 #9

P: n/a
DU
brucie wrote:
in post: <news:c5**********@news.eusc.inter.net>
DU <dr*******@hotWIPETHISmail.com> said:

But just for the sake of this thread, Brucie, would you

oh no, i think you've mistaken me for someone who has a clue.

be against a modification in CSS3 User Interface to include cursors
which would indicate
- an .exe file
- a mailto:
- a target="_blank"

what sort of checks and balances are going to be used to ensure that if
a cursor says its a mailto it really is and not a PPC link to some sicko
porn?


Yeah, that is a problem.
its a nice idea but open to waaay too much abuse which would make the
whole thing untrusted and annoying. browsers using it without author
control would be nice.

the little voices agree with me.


Understood. But
a[target="_blank"] {cursor:-moz-open_blank_window;}
for instance is very reliable, furthermore if integrated into the
browser default html.css (or userContent.css). I'm referring to Mozilla
here.

CSS3 hyperlink also asked:
"How are secondary (or even tertiary) links styled? Do they need to be?
Or should their interactivity be left up to the user agent?"
http://www.w3.org/TR/2004/WD-css3-hy...4/#open-issues

Regarding .exe,
a[href$=".exe"] {cursor:-moz-download-trigger;}
will work reliably in CSS3 selector compliant browsers.
http://www.w3.org/TR/css3-selectors/#selectors

Anyway, this could be either in the browser default CSS values or
available to user-defined style Sheets with !important keyword.

DU
Jul 20 '05 #10

This discussion thread is closed

Replies have been disabled for this discussion.