Images on buttons

admin

Administrator
Staff member
Hi. I would like to be able to replace a button with my own image.

<FORM>
<BUTTON><IMG src=http://www.webdeveloper.com/forum/archive/index.php/"face.gif"></IMG></BUTTON>
</FORM>

That works, but the grey of the button is still there. I assume there is a way to use masking to lose the button image, but still keep the face image?

Thanks for any help.

P.S. I need to use a form element for this, so just using <img> with onClick won't work. Need to use <BUTTON> or <INPUT> or something directly related to the form.You can use <input type="image" src=http://www.webdeveloper.com/forum/archive/index.php/"face.gif">.

AdamOk, that works, but it forces the form to submit. Is there any way to force this to NOT submit the form?

What I need it for is an editor page. I have a text area in the form as well, and I want to be able to click an image that will insert text at the cursor position in the text area. the reason I need it as a form element is that I need to access the text area from within the same form. So I need to go by way of this.form.txtMessage. When i put an image in the form and try to get to that path, I get a script error. I can only get to that path from form elements it seems. It's a real pain in the rear end, but I guess you have to do what you have to do sometimes.

The technique you posted does in fact allow me to use that path, but it also makes the form post for some reason. Is there am action or something I can add to it to make it not submit the form?Nevermind. I figured it out. Just need to do a:

<INPUT TYPE="image" src=http://www.webdeveloper.com/forum/archive/index.php/"face.gif" onClick="javascript:YourFunctionHere();return false;"></INPUT>

Thanks for all the help. =)
 
Back
Top