Submit button

[michellerobbins56]

I have a form where I need to know when the submit button has been clicked. I check for when the submit button is clicked by the following in VBscript:

If Request.Form("btnSubmit") <> "" then


My submit button is as follows in HTML:

<input type="submit" name="btnSubmit" value="&nbsp;" style="background-image: url(images/buttonimage.jpg); border-width:0px; width:100px; height:18px">


This all works fine and my submit button has an image on it instead of text. However my only problem is I want the mouse cursor to change to the standard 'hand' as it does when you hover over a hyperlink. How can I create an OnClick event to do this? I have tried various other ways to do this such as using input type=image but this does not work with some of my other ASP code so I need to stick with the button as it is.

Thank you very much for any help with the onclick event.

 

[michellerobbins56]

I think I meant to say hover event instead of an onclick event... I need the mouse cursor image to change when the cursor "hovers" over the button. I have had a long search to find out how to do this but can't find out how to do this.

Thank you for any help.

 

[michellerobbins56]

Ok, an update: I have managed to change the mousecursor by doing the following in the input tag for the submit button:

onMouseOver="this.style.cursor='hand';"

This works!

However... it does not work in Firefox or Netscape 8. Please can anyone tell me what the equivalent is of the above which will work in these two browsers as well as IE?

Thank you for any help.

 

[kaht]

onMouseOver="this.style.cursor='[!]pointer[/!]';"

-kaht

[small]How spicy would you like your chang sauce? Oh man... I have no idea what's goin' on right now...[/small]

 

[Vragabond]

What kind of convoluted stuff is this? How about:

<input type="submit" name="btnSubmit" value="&nbsp;" style="background-image: url(images/buttonimage.jpg); border-width: 0px; width: 100px; height:18px; [b]cursor: pointer;[/b]">

 

[Andeee]

easy, you do it in a stylesheet:

#submit
{
background-image: url(images/buttonimage.jpg); border-width:0px; width:100px; height:18px;
}

#submit:hover
{
background-image: url(images/buttonimage.jpg); border-width:0px; width:100px; height:18px;
cursor: hand;
}

and use this as the button code:

<input type="submit" name="btnSubmit" value="&nbsp;" id="submit">

Or you could even use an image with a hyperlink that runs the javascript form.submit() function. Im not entirely sure on the exact syntax, but this is a possiblity:

<a href="javascript:submit()">
<img src="images/buttonimage.jpg" style="border-width:0px; width:100px; height:18px;">
</a>

Even better, is there is actually an image input type, which is basically a submit button that displays an image instead. you may still need the css above

css:

#submit
{
border-width:0px; width:100px; height:18px;
}

#submit:hover
{
border-width:0px; width:100px; height:18px;
cursor: hand;
}

html:

<input type="image" src="images/buttonimage.jpg" id="submit" name="btnSubmit" value="&nbsp;">

 

[Vragabond]

#submit:hover
{
border-width:0px; width:100px; height:18px;
cursor: hand;
}

This will not work in any browser. IE supports pseudo classes only on anchor elements, so IE will completely ignore this part and other browsers do not understand IE's proprietary cursor hand, which should be in all other browsers (and even new versions of IE) cursor: pointer. Besides, there is no reason for the :hover pseudo class since your cursor will only change when you hover over the element.

 

[BillyRayPreachersSon]

Absolutely. There's no need at all for any mouseover or hover code - it's just not necessary in this case.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]