The watermark effect is to specify some instruction in the textbox and its very useful to the user to know about the textbox control. For example, A Web form will contains a textbox for the user to enter the Date, you can use the watermark effect on the textbox so that it always displays the date format ‘dd/mm/yyyy’ unless the user has already entered something.

Watermark Effect

Then add the following Jquery in Script tag and also include jquery-1.4.1.min.js file in Head tag.
Code:
 
$(document).ready(function() {
  WaterMark("#txtdate");
});
function WaterMark(ControlID) {
  var watermark = "dd/mm/yyyy";
  if ($(ControlID).val() == "") {
    $(ControlID).val(watermark);
    $(ControlID).css("color", "Gray");
}
 
$(ControlID).focus(function() {
  if (this.value == watermark) {
    this.value = "";
  }
}).blur(function() {
  if (this.value == "") {
    this.value = watermark;
  }
});
}
Mittu, suraj2011 likes this