Bookmark to del.icio.us
FF1+ IE5+ Opr7+
Highlight form element
Note: Modified 06/28/02. Tabbing through form using keyboard now also triggers the highlight effect
Description: Increase the "intuitiveness" of filling out forms on your site with this script. It applies coloring to the form element in focus, better indicating which one the user is currently on. Functions in both IE4+ and NS6+, degrading well as always with the rest.
Demo: Try setting focus on the various form elements below:
Step 1: Add the below script to the <HEAD> section of your page:
Step 2: With the above script is installed, all that's left in adding a simple onClick event handler into the <FORM> tag in question. For example:
<FORM onKeyUp="highlight(event)" onClick="highlight(event)"> " " </FORM>
The effect can be added to more than one form on the same page. Enjoy!
CSS level 2 actually supports a very simple way of accomplishing the above. Unfortunately only NS6 at this time recognizes the code. To learn more about this, please see the following tutorial.