悬停在表单提交按钮上？

Question

How can I make a hover state, preferably underline, with a Form submit button?

..or would it be easier to incorporate a simple JavaScript Img rollover - Ultimately I just need a hover underline state to assure the user the area is click-able.

Update: Currently have;

<input type="submit" onClick="javascript:validForm();" value="SUBMIT" class="subbtn" >




input.subbtn {

    width: 75px;
    height: 32px;
    background-color:#F00;
    font-family:Arial, Helvetica;
    color:#fff;
    border: 0px;
    font-weight: bold;
    font-size:14px;
}


input.subbtn:hover
{
/* when hover (mouse over)*/
    text-decoration:underline;
}

Why isn't this working; and why does it make it so the little clickable hand isn't displayed anywhere - so the users know even less that the area is clickable.

I just want a hover underline, what am I missing?

Answer 1

You can use css to style the buttons, no javascript needed. Make it a normal button:

<input type="button" class="button" onClick="javascript:validForm();">

And css:

input.button
{
/* style it*/
}

input.button:hover
{
/* when hover (mouse over)*/
    cursor:hand;
}

Answer 2

try without ".button" this will apply to all the inputs on oyur page, maybe you must add an "ID".. or maybe not..

input {

}

input:hover
{
    cursor:hand;
}