brianmaierjr
7/29/2014 - 6:58 AM

Holdplacer (New type of placeholder)

Holdplacer (New type of placeholder)

(function($){
	$.holdplacer = function(){
		var $inputs = $('[holdplacer]');

		$inputs.each(function(){
			var $this = $(this);
			var $holdplacer = $this.attr('holdplacer');
			var $holdplacerLabel = $('<div class="holdplacer-label">' + $holdplacer + '</div>');
			
			$holdplacerLabel
			.insertBefore($this)
			.css({
				'left': $this.css('padding-left'),
				'top': (parseInt($this.css('padding-top')) + 11) + 'px'
			})
			.on('click', function(){
				$this.focus();
			});

			$this
			.css('padding-top', '+=' + (parseInt($this.css('padding-top')) + 11) + 'px')
			.on('focus blur', function(){
				$holdplacerLabel.toggleClass('focus');
			});
		});
	}
}(jQuery));