Un tooltip es una herramienta de ayuda visual patentada por Microsoft, que funciona al situar o pulsar con el ratón sobre algún elemento gráfico, mostrando una ayuda adicional para informar al usuario de la finalidad del elemento sobre el que se encuentra.

Crear un tooltip usando jQuery es muy sencillo, lo primero es añadir los estilos que queremos que tenga nuestro tooltip:

	#capaHelp {
		display:none;
		background:url(imagenes/tooltip.png) no-repeat top left;
		width:622px;
		padding:20px 10px 0 20px;
		height:82px;
		color:#000;
		font-weight:bold;
		margin:-100px 0 0 185px;
		position:absolute;
		z-index:101;
	}
	#capaContenido {
		padding:2px 25px 0 0;
		float:left;
		font-size:12px;
		color:#FFF;
		font-weight:bold;
		position:absolute;
	}

La capa ‘capaHelp’ es la capa contenedora del tooltip por eso la posicionamos donde queremos que aparezca y finalmente sobreposicionamos la capa con un z-index.

Añadimos el efecto con jQuery:

$(function() {
	$("#icoHelp").mouseover(function(event) {
		$("#capaHelp").slideToggle();
	});
	$("#icoHelp").mouseout(function(event) {
		$("#capaHelp").slideToggle();
	});
});

La id ‘icoHelp’ tendrá el evento mouseover y mouseout con un efecto ‘slideToggle’ de jQuery.
Como ya he dicho antes, este script es bastante simple pero si más no muy bonito, aquí tenéis más scripts sobre tooltips en jQuery.

Ejemplo: aquí.
Descarga: aquí.