Recent news

Sunday, 29 May 2016

Watermark To Input Box With HTML5 Placeholder With Old Browser Support




Watermark is a jQuery plugin which support html5 place holder and also support old browser.


How To Use

1. Add the below library reference

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
 <script type="text/javascript" src="jquery.watermark.js"></script>


2. Now add the below html tag.

<input type="text" placeholder="First name" id="name"></input>


3. Add the below code to perform operation

<style type="text/css">
        .placeholder {
            color: #CCC;
        }
    </style>

    <script type="text/javascript">
        //<![CDATA[   
        $(document).ready(function () {
             
                     // add placeholder
            $.placeholder();
                    
                     // set focus to the input
            $('#name').focus();
        });
        // ]]>
    </script>



Pranav Singh Author: Pranav Singh

Hello, I am Author of this blog. The main purpose of this blog is to provide all the jQuery plugins which is helpful in designing and developing a web application in a single location from the web.

Previous
Next Post »

E-mail Newsletter

Sign up now to receive breaking news and to hear what's new with us.

Recent Articles