HTML :
<input type="text" value="Search" onclick="if(this.value=='Search'){this.value=''}" onblur="if(this.value==''){this.value='Search'}">
Example :
Steps + Explanation
- Locate your standard input/search field
- Insert the following into the input tag: onclick="if(this.value=='Search...'){this.value=''}" This is responsible for clearing textbox when someone clicks in it.
- Insert the following into the input tag: onblur="if(this.value==''){this.value='Search...'}" This is responsible for resetting the default text if it was left blank.
So, with some super-basic JavaScript, you can achieve this tiny detail that makes a world of a difference in the world of Interaction Design. Note: Don't forget to change "Search..." to your own value!
No comments:
Post a Comment