jQuery.fn.skeletonTip = function(content) {
	var skeletonTipID = 'skeletonTip';	
	return $(this).each(function() {
		var myskeletonTip = new skeletonTip(skeletonTipID, $(this), content);
		$(this).bind("mouseenter", function(event){ myskeletonTip.show(); });
		$(this).bind("mouseleave", function(event){ myskeletonTip.hide(); });
	});        
};

jQuery.fn.skeletonTipDestroy = function() {
	$(this).trigger('mouseleave');
	$(this).unbind('mouseenter');
	$(this).unbind('mouseleave');
};

function skeletonTip(name, object, content) {
	this.name = name;
	this.object = object;
	this.content = content;
}

skeletonTip.prototype.show = function() {
	this.setContent();
	this.setPosition();
	$('#' + this.name).show();
}

skeletonTip.prototype.hide = function() {
	$('#' + this.name).hide();
}

skeletonTip.prototype.setContent = function () {
	$('#' + this.name).html(this.content);
}

skeletonTip.prototype.setPosition = function() {
	var position = this.object.offset();
	
	tipLeft = position.left;	
	tipRight = tipLeft - $('#' + this.name).outerWidth(true) + this.object.outerWidth();
	tipTop = position.top + this.object.outerHeight();
	overallHeight = tipTop + $('#' + this.name).outerHeight(true);
	overallWidth = tipLeft + $('#' + this.name).outerWidth(true);
	
	var scrollTopOffset = (window.pageYOffset) ? window.pageYOffset : (document.documentElement && document.documentElement.scrollTop) ? document.documentElement.scrollTop : document.body.scrollTop;
		
	if (overallHeight >= ($(window).height() + scrollTopOffset)) {
		tipTop = position.top - $('#' + this.name).outerHeight(true);
	}

	if ( overallWidth >= $(window).width() ) {
		tipLeft = tipRight;
	}
	
	$('#' + this.name).css( { 'top'  : tipTop, 'left' : tipLeft }  );
}