Topic awaiting preservation: Using an image as a form reset button (Page 1 of 1)

I have a form where I've set the submit button to an image using the <input type="image"> tag.

This only seems to work with the submit button.
How could I set an image to work as the reset button of a form?
Is it possible in plain html?

Nocturne: I always try to avoid being absolute in my answers (as it is an easy way for people to come along and prove you wrong - usually within a few minutes) but that isn't possible. I think this came up a while ago.

What you can do is set up and image and have a bit of JavaScript on it to reset all the values in the form to '' onclick.

Someone should be along in aminute to prove me wrong

___________________
Emps

FAQs: Emperor

lol

Alright so I did what I normally do when I don't know the answer and checked google.

Seems answer number 2 was this

Which led me here



.:[ Never resist a perfect moment ]:.

bd: Now isn't that something

Actually going for this at Google:
www.google.com/search?q=Reset+Form+button+image

brings up the FAQ at number 5

___________________
Emps

FAQs: Emperor

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 (kinda like Emps suggested):

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

Works beautifully in both IE and Mozilla

[This message has been edited by kuckus (edited 01-31-2003).]

kuckus: No need to apologise [edit: unless you've done something I missed ] that has helped nail a few things down. I have lifted your solution and updated the FAQ:

:FAQ:

Good show

___________________
Emps

FAQs: Emperor