this.imagePreview = function(){	
		xOffset = 30;
		yOffset = 200;
		
	$(".h30").hover(function(e){
		this.t = this.title;
		this.s = this.src;
		this.title = "";
		
		var phase = $(this).attr('rel');
		var c = (this.t != "") ? "<br/>" + this.t : "";
		$("body").append("<span id='preview' class='HelveticaNeueLight shade' style='font-size: 10px'><img height='300' src='"+ this.s +"' />"+ c +"<div class='phase2' align='right'><img src='img/phases/"+ phase+".png' width='81' height='83'></div><br></span>");								 
		$("#preview")
			.css("height","315px")
			.css("top",(e.pageY - yOffset) + "px")
			.css("left",(e.pageX + xOffset) + "px")
			.css("z-index","1000")
			.fadeIn(300);						
    },
	function(){
		this.title = this.t;	
		$("#preview").remove();
    });	
	$(".h30").mousemove(function(e){
		$("#preview")
			.css("top",(e.pageY - yOffset) + "px")
			.css("left",(e.pageX + xOffset) + "px");
	});			
};

$(document).ready(function(){
	imagePreview();
});
