A simple jQuery Plugin, used to scan through your website and automaticly attach focus,blur and keydown effect on your form fields. By using FormHighlighter plugin you will be able to control all your form fields from one place.
Installing Form Highlighter plugin is more about styling your forms
with CSS. When you get the styling right all you need to to do is to point
Form Highlighter at your forms.
This will make Form Highlighter go through all your form fields and apply the
inner lable effect without any styling.
Click here to see more demos and examples
Form Highlighter comes with some advanced options that will make your forms more
uniqe and flexible at same time. For example you can call your own custom
functions after each Blur and Focus event plus much more.
classFocus: ' Css Class Name '
classBlur: ' Css Class Name '
classKeyDown: ' Css Class Name '
classNotEqualToDefault: ' Css Class Name '
clearField:' true/false '
onBlur: ' transition callback '
Form Highlighter is very designer friendly. Your form fields can have 4 stages.
Blur - Main style of your fields.
Focus - The style that will be active when used clicks on the form field.
Keypress - When user start to type something inside your form fields
NotEqualToDefault - When user has filled out a formfield with content that is not the same as the default lable eg. "Type your name here"
So as designer all you need to do is to make 4 CSS classes. One for each event you need.
When your designer comes with a layout and some demands on how the form should
look like or act like, just put a big smile on your face and say " Yes, it can
be done ". Form Highlighter is very flexible and will make your day good in 5
Here is a quick example in how you gonna make a 4 CSS classes swich.
This call will toggle between all 4 CSS Class: Blur, Focus, Keypress and NotEqualToDefault.