/*
 * Image preview script 
 * powered by jQuery (http://www.jquery.com)
 * 
 * written by Alen Grakalic (http://cssglobe.com)
 * 
 * for more info visit http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery
 *
 */
 
this.imagePreview = function(){	
	// Initialize offset variables
	xOffset = 10;
	yOffset = 30;
	
	/**
	 * Handle the hover event
	 */
	$("img.preview").hover (
		function(e){
			// Does this image have a title?
			var strImage = $(this).attr("src");
			var strAlt = $(this).attr("alt");
			// Image set?
			if (strImage != "") {
				// Add hover
				$("body").append("<p id='preview'><img src='"+ strImage +"' alt='Loading...' width='300'/><br/>"+ strAlt +"</p>");
				// Position the preview and fadeIn
				$("#preview")
					.css("top",(e.pageY - xOffset) + "px")
					.css("left",(e.pageX + yOffset) + "px")
					.fadeIn("fast");
			}
	    },
		function(){
			// On exit hover, remove
			$("#preview").remove();
	    }
	);
	// Move preview with mouse move
	$("img.preview").mousemove(function(e){
		// Move position of preview
		$("#preview")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px");
	});				
};

/**
 * Call image preview on load
 */
$(document).ready(function(){
	// Call handler
	//imagePreview();
});