free hit counter

Cross-Browser HTML5 Placeholder Text

One of the nice enhancement in HTML5 web form is being able to add placeholder text to inputfields.

Placeholder attribute allows you to display text in a form input when it is empty and when it is not focused (it clears the field on focus).
This is a nifty feature, but it is not supported by all browsers yet. This tutorial will show you how to use Modernizr to detect if placeholder is supported,
or else use jQuery to display the fallback placeholder text dynamically.

Example

Two input fields with a placeholder text:

<form action=”demo_form.asp”>
<input type=”text” name=”fname” placeholder=”First name” /><br />
<input type=”text” name=”lname” placeholder=”Last name” /><br />
<input type=”submit” value=”Submit” />
</form>

But this when you run this html page on IE or other old browser placeholder not working .

so here i give you demo and source code . you need to include a js file and a script tag in page footer then everything is okay .

so enjoy it

 

See Demo here

Download Code

Source : https://github.com/danielstocks/jQuery-Placeholder

[subscribe2]

Leave a Reply