Download highlight input script

Demo

Bookmark and Share

Download files

You can download the entires script from this Zip file.

Configuration

This script is easy to configure. All you have to do is to define how the active input should be highlighted. This is done by CSS. Then you have to call a function at the bottom of your page to initialize the script.

Define CSS

Here's an example how I have created the CSS in this demo

.textInput,textarea{  /* General style for my inputs when they're not highlighted */
  width:300px;  
  background-color:#FFFFFF;
  border:1px solid #000;
}


.inputHighlighted{  /* Highlighting style */
  background-color:#317082;
  color:#FFF;
  width:300px;
  border:1px solid #000;
}

.textInput,textarea is the rule for the inputs when they're not highlighted. I'm using a white background color and a black border. .inputHighlighted defines how the input should look like when it's active. Here, I have defined a dark green background color and a white text color. The border is defined as black.

Initialize the script

To initialize the script, add the following lines at the bottom of your HTML file:

<script type="text/javascript">
// Initialize the input highlight script
initInputHighlightScript();
</script>

Comments

No one has commented this - be first!

Post your comment

Don't have an avatar? Create one at Gravatar.com.

Confirmation code:

Go to cbolson.com


About/Contact | A good idea? | Submit a script | Privacy notice
© 2005 - 2014 dhtmlgoodies.com