focusMagic jQuery Plugin
Thursday, September 17th, 2009This plugin is meant to expedite the basic process of making form fields empty or clear on focus and refill on blur, depending on a few specs… a watermark. The three different scenarios that I have built for are represented.
- A normal form field watermark that empties on focus and refills on blur.
- A value that is set by the server trumps anything that the plugin does. (Note: this way, if a user has to fill out the form again because one of the fields didn’t validate, the server can send values so that the user doesn’t have to refill the whole form)
- There may be a time when you want to ignore the plugin and keep your label visible. Just add a ‘ignore’ class to your label and the plugin doesn’t touch it.
This solution focuses on accessibility as it does not remove the label, just moves it off the viewport. This way, if a user does not have Javascript, CSS, or uses a screen reader, they will still get normal labels.
View a demo
Download plugin (link to jQuery plugins)
Please let me know what you think about it, or if there is anything I should do to improve.
