jQuery.fn.hint = function (opts) {
  
  var defaults =  {
	  blurClass : 'blur',
	  top		: '1px',
	  left		: '1px',
	  color		: '#000'
  }
  
  var settings = $.extend({},defaults,opts);
  
  return this.each(function () {
    // get jQuery version of 'this'

    var $input = jQuery(this),
	    $parent = $input.parent(),
		$parentID =  $parent.find('.hint').attr('id'),

    // capture the rest of the variable to allow for reuse
      value = $input.attr('value'),
      $form = jQuery(this.form),
      $win = jQuery(window);
	
	var $label = $($parent.find('label.hintL'));
	$label.css({
		'position' : 'absolute',
		'top' : settings.top,
		'left' : settings.left,
		'color' : settings.color,
		'display' : 'block'	
	}).attr('for',$parentID);
		
	$label.hover(
		function(){
			$(this).css('cursor','text');
		},
		function(){
			$(this).css('cursor','default');
		}
	);
	
	$label.click(function(){
		remove();
	})
	
	$input.removeAttr('value');
	
	$parent.css('position','relative');
	$parent.append($label);
	$input.addClass(settings.blurClass);
	
    function remove() {
	  if (($input.val() === "" || $input.val().toLowerCase() == value.toLowerCase()) && $input.hasClass(settings.blurClass)) {
		  $label.fadeOut(85);
		  $input.val("").removeClass(settings.blurClass);
      }
    }

	$input.blur(function () {
	  $this = $(this);
	  
	  if($this.val() === "" ){
		  $label.fadeIn(85);
		  $input.addClass(settings.blurClass);
	  }

	}).focus(remove) // now change all inputs to value
	// clear the pre-defined text when form is submitted
	$form.submit(remove);
	$win.unload(remove); // handles Firefox's autocomplete
    
  });
  
};
