Highlighting Input Fields
September 25th, 2008

A nice feature you can provide your visitors is highlighting the input fields of your forms.This lets them know which field is active as they tab through your form. This method does not interfere with Google’s autofill toolbar feature.

Add the following script in a custom header:

&lt;script type=&quot;text/javascript&quot;&gt; <br />var inputColor = &quot;#00ff00&quot;; // This specifies the bgcolor <br />var saveColor; <br /> <br />function setColor(me) { <br />saveColor = me.style.backgroundColor; <br />me.style.backgroundColor = inputColor; <br />} <br /> <br />function resetColor(me) { <br />me.style.backgroundColor = saveColor; <br />} <br />&lt;/script&gt;

The only change you need to make is to modify the value of the inputColor variable to the HTML hex color code you want to use as the highlight color.

To use the script, enter the following into the Code field of every form input object you want highlighted (including textareas):

onfocus="setColor(this);" onblur="resetColor(this);"


One Response to “Highlighting Input Fields”

    john phillips says:

    Hi LowTech, have become really enamoured with SS’s graphics-based construction method. It precludes me, though, from adding helpful codes like you provide. I am trying to accomplish the following things and the SS help feature comes up short.
    1) On a drop-down list, how to I assign different URLs for the choices the user will see?
    2) How do I assign a color change when they mouse over a specific item in the list?
    3) For slideshows, how does one insert a flash picture viewer and have it start automatically?
    Thanks!
    John Phillips
    Sleepy Hollow NY

Leave a Reply

Spam protection by WP Captcha-Free


May 24th, 2012