Using an image as a submit button
A submit button created using <input type="submit> is rather a drab looking gray colored entity, unless you know style sheets. For all you designers who have detested this dull button, here is a solution to add color to your HTML forms.
The simplest way is to use an image as a submit button employing the <input> HTML form tag.
<input type="image" src="butup.gif" alt="Submit button">
When using this tag, you should remember some important differences between Netscape and Internet Explorer and how they handle this tag.
- Netscape ignores the alt attribute.
- Netscape gives no indication that this image can be used to submit a form. In Internet Explorer, the mouse cursor changes to a hand.
Click on the image below to see how it works.
Furthermore, you notice that I've attached onmouseover and onmouseout event handlers to make your button more interactive.
When you mouse the mouse pointer over the image, the source (src) of image sub_but, which is located in myform form is changed to butdown.gif via onmouseover() and when the mouse pointer is removed from the image, the source is changed to butup.gif via onmouseout.
Move your mouse over the button to see the how it behaves and then click on it.
Comments, questions, feedback... whatever!
Page contents: Details on how to use an image as a submit button for an HTML form on a web page. This image can also have mouseovers and thus not only better the look of a web page but also make it interactive.
Recent Blog Posts
- Hotmail Sign In page
- Create a Hotmail account - Instructions
- Create Gmail address
- Download and install Outlook Express
- Get your free Gmail address
- Outlook Express new version
- Create my own email address
- Browers for Windows list
- Get email address
- Color combinations for web sites and pages
- Create Yahoo ID