Here is a quick plugin I recently created, I know there are already a lot of existing alternatives, but here is one I recently created for one of our clients.

HTML:
Make sure each tip is within its own element (“tip-item“), the HTML below shows the “activator” (the element that gets mouseover), this has a class attached to it called “tip-specific-class“, and the next element is the tooltip itself with the same class, the class must be the same to ensure the plugin knows which tip relates to which element.

<div class="tip-item">
<div class="activator tip-specific-class">Hover Over Me - I can be an image as well!</div>
<div class="tip tip-specific-class">
ToolTip Content - Put anything you like in here!
</div>
</div>

<style type="text/css" media="screen">
	.activator {
		background:#0099ff;
		width:100px;
		height:100px;
		padding:20px;
		cursor:pointer;
	}
	.tip-item {
		position:relative;
	}
	.tip {
		display:none;
		width:200px;
		height:100px;
		background:red;
		padding:20px;
		position:absolute;
		top:0px;
		left:0px;
		z-index:1;
		border-radius: 10px;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		box-shadow:1px 1px 5px #000;
		-moz-box-shadow:1px 1px 5px #000;
		-webkit-box-shadow:1px 1px 5px #999;
	}
</style>

JS:
The default options of the plugin.

var defaults = {
	tipClass: 'tip', //the class name for your tip
	tipFadeEasing: 'easeOutQuint', //easing method
	tipFadeDuration: 200, //fade duration
	tipOpacity: 1, //opacity of tip when mouseover
	tipOffset: 10 //offset the tip relative to mouse cursor in pixels
};

Initialise the plugin:
The following initialises the plugin, i have changed the opacity to 0.9 and offset the tip by 20px just as an example.

jQuery(function(){
		jQuery('.activator.tip-specific-class').BAToolTip({
			tipOpacity: 0.9,
			tipOffset: 20
		});
	})

View Demo

Download Source Files (including example): jquery.BA.ToolTip