I recently had a requirement to display the description of the textbox using the “placeholder” attribute. The problem, of course, is not all browsers support this. The fallback would be to display a label where “placeholder” is not supported.
Modernizr makes this easy.
From The Modernizr site:
“Modernizr uses feature detection to test the current browser against upcoming features like rgba(), border-radius, CSS Transitions and many more.”

It’s a pretty simple concept. Just add the modernizer script to the top of your webpage, then features are tested against the browser and allows the developer to write code based if that feature exists or not.

Take the following example:

html

<label for="txtsearch" id="lblSearch" style="display:none">Search products</label>
<input type="text" placeholder="Search products" id="txtsearch"/>
<input type="button" value="Go"/>

Javascript

 
if (!Modernizr.input.placeholder){
    //display the label where placeholder is not supported.
    $('#lblSearch').show();
}

As you can see the input textbox has a attribute placeholder=”Search products”. This will be ignored by browsers that do not support it. The javascript code uses the Modernizr feature detection and displays the label.
If you want to take advantage of modern browser features but still have to support older browsers, I strongly recommend you take a look at Modernizr .