Tooltip+and+Image+Preview

Tooltip & Image Preview

main.js modificado code format="javascript" this.imagePreview = function{ /* CONFIG */
 * http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery
 * Ejemplo: para que una imagen salga engrandecida al pasar el ratón por el thumbnail
 * instalación
 * descargar main.js y ponerlo
 * modificar el offset y los tamaños máximos de la imagen que saldrá

xOffset = 150; yOffset = -500;

// these 2 variable determine popup's distance from the cursor // you might want to adjust to get the right result

/* END CONFIG */ $("a.preview").hover(function(e){		this.t = this.title;		this.title = "";		var c = (this.t != "") ? " " + this.t : "";		$("body").append(""+ c +" ");		$("#preview")			.css("top",(e.pageY - xOffset) + "px")			.css("left",(e.pageX + yOffset) + "px")			.fadeIn("fast");    },	function{		this.title = this.t;		$("#preview").remove;    }); $("a.preview").mousemove(function(e){		$("#preview")			.css("top",(e.pageY - xOffset) + "px")			.css("left",(e.pageX + yOffset) + "px");	}); };

// starting the script on page load $(document).ready(function{	imagePreview; }); code

code format="xml"
 * Ejemplo con umbraco y xslt

#preview{ position:absolute; border:1px solid #ccc; background:#333; padding:5px; display:none; color:#fff; }

       code se verá así al pasar el ratón por encima de la imagen pequeña