Need mouseover effect on submit button

Using CSS to change submit button appearance

[Storyman]

Because I'm using CSS to change the appearance of the submit button the user my not necessarily understand that they can click on the text.

I would like the cursor to turn into the pointing finger (or whatever it is that they are using) so the user will understand that it is a link.

It seems that javascript should be able to handle the job, but I'm not sure how to make it happen.

Suggestions appreciated.

[Rambo Tribble]

In the CSS for the element in question, simply include the rule: cursor:pointer;

[Birdman]

It's cursor: hand; right?

[Rambo Tribble]

Cursor:hand is IE-specific syntax. Cursor:pointer is the standards-compliant CSS property.

[Birdman]

Ah, learn something new everyday! Thanks.

[quirksmode.org...]

cursor: pointer

pointer: Explorer 6 Windows, Mozilla, Opera, Explorer 5 Mac, Safari 1.0+

hand: Explorer 4-6 Windows, Opera, Explorer 5 Mac, Safari 1.2

The cross-browser code does not work in Safari 1.0. 1.2 has no problems.

This paragraph has cursor: pointer. This is the official way to change the cursor to a pointer.

cursor: hand

This paragraph has cursor: hand. This is the Microsoft way to to change the cursor to a pointer.

Cross browser

The only cross browser syntax for a pointer/hand is:

p.pointerhand {
cursor: pointer;
cursor: hand;
}

Note that the two declarations must be in this order.

[Storyman]

Rambo Tibble & Birdman,

Your help is greatly appreciated. It's a thrill to see it work.

Storyman

[Rambo Tribble]

Here's the W3C's take on the cursor property and its values (note that "hand" is not among them): [w3.org...]

[Birdman]

Just don't use "pointer" only or IE5 won't recognize it. I learned much from this discussion. :)

[devedge.netscape.com...]

Unfortunately, IE5.x/Win doesn't recognize the value pointer as meaning anything at all. IE6/Win and IE5.x/Mac do both recognize pointer as well as hand, fortunately. Meanwhile, Mozilla and Netscape 6+ follow the CSS2 specification and handle pointer, but ignore the proprietary value hand.

So if Mozilla/Netscape ignores hand and IE5.x/Win ignores pointer, what's an author to do? Ask for both in the proper manner, and you shall be rewarded.

a {cursor: pointer; cursor: hand;}

Birdman