// Author: Gareth Price
// With thanks to: Gary Mardell =)

// Do what you want with this- consider it a gift!

// Things to consider:

	// You need to add a rel attribute to the a tag (rel="") and a class of tooltip (class="tooltip")
	// Add below in a new div what you would like shown in the tooltip
	// Give the div an id of the rel you gave the link (!important) and a class of 
	// hide (and then hide it using CSS [display: none;])
	// You can style the tooltip by using CSS, referencing #tooltipx
	// You're done!
	
	// View my site (http://iamgp.com) for a full, working example.

	this.tooltip = function() {
		
		// You might need to change these settings.
		// They determine how far away the corner is
		// from your mouse
		
		x = 10;
		y = 30;
	
		
		$(".tooltip").hover(function(e) {
	
			var rel = this.rel;
			var s = $("body").find("#"+rel).html();
	
			$("body").append("<p id='tooltipx'>" + s + "</p>");
			$("#tooltipx").css("top",(e.pageY - x) + "px").css("left",(e.pageX + y) + "px").fadeIn("slow");
				
		},
	
		function() {
		
			$("#tooltipx").fadeOut("fast");
			$("#tooltipx").remove();
			
		});
	
		$("a.tooltip").mousemove( function(e){

			$("#tooltipx") .css("top",(e.pageY - x) + "px").css("left",(e.pageX + y) + "px");
			
		});
	};
	
	$(document).ready(function() {
		
		tooltip();
		
	});