SHARE
Facebook X Pinterest WhatsApp

Clicking On Images In Forms

Written By
thumbnail
Joe Burns
Joe Burns
Jan 4, 2005

     I am getting a ton of mail from people who want active images on their site that do not produce an hand cursor when you go over it with the mouse. I looked around a bit and found how it was done. Here’s an example:





     The image above is active. If you click on it, you will be sent to the Goodies Home Page. Yet, when your mouse is on it, there’s nothing to indicate it is an active image. Here’s the code I used to make it:



    <FORM METHOD=”LINK” ACTION=”index.html”>

    <INPUT TYPE=”image” SRC=”htmlgdds.gif” “WIDTH=”101″ HEIGHT=”102″ BORDER=”0” ALT=”To Goodies”>

    </FORM>



Here’s What’s Happening


     

The format is almost identical to the

link button

format. The difference is that you insert an image where you would configure the button.




  • FORM starts the process.
  • METHOD=”LINK” tells the computer this image will link with another page.
  • ACTION=”—“ is the URL of the link.
  • INPUT TYPE is an image.

     From there on out, it follows the format of an image using the SRC, HEIGHT, WIDTH, and ALT commands to define the size and alternative text. You can set the BORDER to any number you want, however “0” loses any blue border.

     And one of the nice side effects of this format is that there is no hand cursor when the mouse passes over.

     Well, that’s how it’s done, but I don’t quite understand why someone would want this. I thought the point was to make the links obvious. This does a pretty good job of hiding that the image is a link. Oh well… to each their own. I hope this helps.

Enjoy!

Recommended for you...

How To Improve Website Navigation
Enrique Corrales
Dec 11, 2021
Common UX Design Mistakes
Understanding Z Index in CSS
Tariq Siddiqui
Aug 24, 2021
How to Improve Your Website’s User Experience (UX)
Enrique Corrales
Jun 30, 2021
HTML Goodies Logo

The original home of HTML tutorials. HTMLGoodies is a website dedicated to publishing tutorials that cover every aspect of being a web developer. We cover programming and web development tutorials on languages and technologies such as HTML, JavaScript, and CSS. In addition, our articles cover web frameworks like Angular and React.JS, as well as popular Content Management Systems (CMS) that include WordPress, Drupal, and Joomla. Website development platforms like Shopify, Squarespace, and Wix are also featured. Topics related to solid web design and Internet Marketing also find a home on HTMLGoodies, as we discuss UX/UI Design, Search Engine Optimization (SEO), and web dev best practices.

Property of TechnologyAdvice. © 2025 TechnologyAdvice. All Rights Reserved

Advertiser Disclosure: Some of the products that appear on this site are from companies from which TechnologyAdvice receives compensation. This compensation may impact how and where products appear on this site including, for example, the order in which they appear. TechnologyAdvice does not include all companies or all types of products available in the marketplace.