===========================================================================
textClear.js v0.0.3
jQuery Plugin to clear input field text on fly - like as provided in Internet Explorer 10
Requires - textClearStyle.css and jquery lib(>1.6)
**Website:** http://exexzian.github.io/TextClear/
**jQuery Plugin Link:**: http://plugins.jquery.com/textClear/
**For Demo:** click here
**Features**:
➊ ��On keyPress it provides ✘ � image on the extreme right corner of the input field to clear out the text
➋ ����Handles multiple input fields
➌� ��Cross Image changeable via CSS
➍��Ohhh!! 4th feature provdies 4 fancy cross images for usage under images directory
Note: It overrides the IE-10's default ✘ �� image so as to offer the same look and feel on all browsers.
Usage:
✔ �� Add noTextClear class in all those text input fields in which you want to apply the plugin effect like as follows:
<body>
...
...
Name: <input id="txt" class="noTextClear" type="text" /><br/>
Email: <input id="email" class="noTextClear" type="email" /><br/>
Telephone No.: <input id="tel" class="noTextClear" type="tel" /><br/>
Password: <input type="password" class="noTextClear" />
...
...
</body>
✔ � Inside HTML Head Tag add path to jquery and textClear.js and supporting stylesheet textClearStyle.css.
■ You may need to change the paths depending on your folder structure.
<html>
<head>
<script type="text/javascript" src="lib/jquery.min.js"></script>
<script type="text/javascript" src="textClear.js"></script>
<link rel="stylesheet" href="textClearStyle.css" type="text/css"/>
</head>
<body>
...
</body>
</html>
✔ �� Now Call textClear() in your JavaScript file using $('.noTextClear') selector as:
$('.noTextClear').textClear();
✔ � And to change ✘ � image: simply browse inside textClearStyle.css and change its background-image property as follows inside .crossClear class:
background-image: url('YourImageUrl');
■� And Of course you can choose other images provided in images directory as well