How do I use an image input as a reset button for a form?

Technically it isn't possible (as far as I'm aware and no one has corrected me yet) to have the attribute type="image" for reset input buttons. kuckus has suggested some answers:

quote:

---

Two possibilities:

1. Using CSS on the standard Reset button, like

<input value="" type="reset" style="background-image: url(http://www.OzoneAsylum.com/images/ASYLUM44b.jpg); border: 0; width: 300px; height: 90px; background-color: transparent;" />

This works as expected in IE, but doesn't in Mozilla. It just displays a blank gray button (which the correct width and height though).

2. Using JavaScript and the image's onclick event to reset the form:

<img src="http://www.OzoneAsylum.com/images/ASYLUM44b.jpg" onclick="document.forms[0 is a broken link.].reset();" />

Works beautifully in both IE and Mozilla

---

-------------------------
Relevant threads:

Reset form button as ImageField???

Using an image as a form reset button

-------------------------
Relevant links:

The JavaScript solutions:

How do I use my own graphic button to reset all the text fields in a form?

graphic form buttons script

___________________
Emperor

(Added by: Emperor on Fri 18-Oct-2002)

(Edited by: Emperor on Fri 31-Jan-2003)