/*
 * Tooltip script 
 * Author: jfranklin
 * 
 * Usage: $('#selector').tooltip();
 *		  $('#selector').tooltip(xOffset,yOffset); - make the tooltip appear away from the selector
 *
 * Notes: notice we have to copy the title attribute and clear it, this is because IE will still show
 * 		  the tooltip regardless of us stopping any propagation. 
 */
 (function($) {
 
 	jQuery.fn.tooltip = function(xOffset, yOffset) { 	
 	
 		if(xOffset == undefined) xOffset = -2;
 		if(yOffset == undefined) yOffset = 0;
 		var tip = "";
 	
 		$(this).hover(function(event) {			
 			tip = $(this).attr("title");
 			$(this).attr("title", "");
 			$('body').append('<p id="tooltip" style="position:absolute; border:1px solid #333; background:#f7f5d1; padding:2px 5px; color:#333; display:none;">' + tip + '</p>');
 			$("#tooltip").css("top", (event.pageY - xOffset) + "px")
 						 .css("left", (event.pageX - yOffset) + "px")
 						 .fadeIn("fast");
 		}, function(event) { 	
 			$(this).attr("title", tip);
 			$("#tooltip").remove();
 		});
 		
 		$(this).mousemove(function(event) {
 			event.stopPropagation();
 			$("#tooltip").css("top", (event.pageY - xOffset) + "px")
 						 .css("left", (event.pageX - yOffset) + "px");
 		});
 
 	};
})(jQuery);