$(document).ready(function(){
	
	/*
	create div tooltip
	*/
	$("<div id=\"tooltip\"></div>").appendTo("#body")
	
	/*
	count tooltips in document
	*/
	numTooltips = $(".tooltip").size();
	
	/*
	create attribute 'tooltip' containing the text and remove attribute 'title' so this will not be shown
	*/
	for (i=0; i<numTooltips; i++) {
		$(".tooltip:eq(" + i + ")").attr( "tooltip", $(".tooltip:eq(" + i + ")").attr( "title" ) );
		$(".tooltip:eq(" + i + ")").removeAttr( "title" );
	}
	
	/*
	create mouseover action, filling the text and showing the tooltip
	*/
	$(".tooltip").mouseover( 
		
		function(event) {
			$("#tooltip").css( "left", event.pageX + 15 );
			$("#tooltip").css( "top", event.pageY + 15 );
			$("#tooltip").html($(this).attr( "tooltip" ));
			$("#tooltip").css( "display", "block" );
		}

	);
	
	/*
	create mouseout action, hiding the tooltip
	*/
	$(".tooltip").mouseout( 
		
		function() {
			$("#tooltip").css( "display", "none" );
		}

	);
		
});