jQuery(document).ready(function() {
      jQuery.fn.counter = function() {
	      jQuery(this).each(function() {
		    var max = 105;
		    var val = jQuery(this).attr('value');
		    var cur = 0;
		    if(val) // value="", or no value at all will cause an error
		      cur = val.length;
		    var left = max-cur;
		    jQuery(this).after("<div id='counter'>"
		      + left.toString()+"</div>");
		    // You can use something like this to align the
		    // counter to the right of the input field.
		    var c = jQuery(this).next("#counter");
		    c.width(27);
		    c.css("background","#E0E0D8");
		    c.css("padding-left","9px");

		    jQuery(this).keyup(function(i) {
		      var max = 105;
		      var val = jQuery(this).attr('value');
		      var cur = 0;
		      if(val)
			    cur = val.length;
		      var left = max-cur;
		      jQuery(this).next("#counter").text(left.toString());
		      if(jQuery("#text").attr('value').length > 0){
			jQuery("#text").val(jQuery("#text").attr('value').substr(0, 105));
		      }
		      return this;
		    });
	      });
	      return this;
    }
    jQuery("#text").counter();
});


