Today’s post brings us more or the ever popular jQuery and HTML5 plugins focused on HTML placeholders for form input fields. If you didn’t know HTML5 placeholder is a new attribute to INPUT elements provided to us by HTML5 markup. The placeholder attribute shows text in a field until the field is focused upon, then hides the text. Some browsers such as Internet Explorer however do not support this so jQuery can provide a useful fallback to those unwilling browsers.
HTML5 Placeholder Example
Let’s take a look at the plugins!
1. Sticky Placeholders jQuery Plugin
2. jQuery Form Labels Plugin
The jQuery FormLabels Plugin is a result of working with hundreds of different clients, sites, and especially forms. Every form is different, so building a uniform label generator was not an easy task.
3. jQuery Placeholder Plugin
This is a simple plugin for jQuery that provides support for the HTML5 placeholder attribute in browsers that do not already support it.
A jQuery plugin that formats text input fields with unobtrusive labels featuring interactive suggestions.
5. Sign in Form Placeholders
Tested works IE7+
6. In-Field Labels jQuery Plugin
A simple plugin that turns properly formatted HTML forms into forms with in-field label support. Labels fade when the field is focussed and disappear when text entry begins.
A jQuery Plugin, presented by Ape Unit GmbH, coded by Paul Lunow.
8. Advanced jQuery Placeholder Plugin (cross-browser support)
Plugin that enables you to use the Placeholder attribute inside your input fields.
Sam Deering has 15+ years of programming and website development experience. He was a website consultant at Console, ABC News, Flight Centre, Sapient Nitro, and the QLD Government and runs a tech blog with over 1 million views per month. Currently, Sam is the Founder of Crypto News, Australia.
The Principles of Beautiful Web Design, 4th Edition
Docker for Web Developers
Learn PHP in One Day and Learn It Well