Graphical buttons

To create a graphical button, use the <input> tag and set the type attribute to image. You also enter the URL of a GIF or JPEG image. The browser displays the button on your page just like any other picture.

For example:

Make sure you design graphical buttons that look like buttons, so your users know to click on them. You can also use the align attribute with your graphical buttons just like you would with the <img> tag.

When you click on a graphical button, the browser sends two parameters to the server: the x position of the mouse and the y position of the mouse. For this to work correctly, you must name your button with the name attribute, like this:

  <input type="image" src="go.gif" name="go">

When you click on this button, the browser sends parameters named go.x and g.y to the server. The position of the mouse is worked out relative to the button picture, with the upper left corner being location (0,0).

The mouse position may or may not matter to your server script. If it does not, the presence of these two parameters tell the script that the user pressed that button. If the position does make a difference, you can use these values to take an action in your script.

You can also use the name attribute to add an internal name to the field so the program that handles the form can identify the fields.