input text box watermark effect using jquery

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js" type="text/javascript"></script>
<style type="text/css">
.UsernameCss { color:#9B9B9B; }
</style>

$("txtUserName").addClass("UsernameCss").val("Username")
.focus(function(){ if($(this).val() == "Username") { $(this).removeClass("UsernameCss").val(""); } })
.blur(function(){ if($(this).val() == "") { $(this).val("Search").addClass("UsernameCss"); } });

<input id="txtUserName" name="txtUserName" type="text" />


Tag: css, input, jquery, jquery watermark for textbox, textbox, watermark