Substitute Form Button For An Image homemade images in forms buttons

[mizako 0]

Hi,
I have the next formular :

 <form method='post' action='index.php?mode=2&id=1'>                <input type='hidden' name='name' value='Canon Digital Ixus 700'/>                <input type='hidden' name='id' value='1'/>                <input type='hidden' name='qty' value='1'>                <input type='hidden' name='cost' value='40'>                <input type='submit' value='Add to cart' name='add'>              </form>

I want to substitue the add button for an image

<img       src="./images/kaufen.jpg" />

that i created but i want still to have the same funcitonlity when someone clicks. How can i do this?
Thanks in advanced!

[bureX 0]

Hi there!You need to replace your image with this code:<INPUT TYPE="image" SRC="./images/kaufen.jpg" BORDER=0 ALT="Submit">This will make the image "./images/kaufen.jpg" act as a button. Make sure that the BORDER property is set to 0 (like in my example) to avoid your image from getting an ugly blue border.Don't forget, this code has to be inside the <form> </form> tags!

[mizako 0]

Hi there!

 

You need to replace your image with this code:

 

<INPUT TYPE="image" SRC="./images/kaufen.jpg" BORDER=0 ALT="Submit">

 

This will make the image "./images/kaufen.jpg" act as a button. Make sure that the BORDER property is set to 0 (like in my example) to avoid your image from getting an ugly blue border.

 

Don't forget, this code has to be inside the <form> </form> tags!

159771[/snapback]

Thanks it works, but i have to use an hidden input field to obtain the desire effect too. I explain myself:

<INPUT TYPE="image" name="kaufen" SRC="./images/kaufen.jpg" BORDER=0 ALT="Submit">

Does not work instead i have to use:

<input type="hidden" name="kaufen" value="kaufen"/>

<input type="image" src="./images/kaufen.jpg" value="submit"/>

[s2city 0]

Keep in mind that some browsers, such as Firefox and Opera won't show your image... they've got default images for Form Buttons.