$(document).ready(function(){
	var xOffset = 10;
	var yOffset = 20;
	var w = function()
	{
		if($.browser.msie)
		{
			return document.compatMode == "CSS1Compat"? document.documentElement.clientWidth :document.body.clientWidth;
		}
		else
		{
			return self.innerWidth;
		}
	}
	
	var h = function()
	{
		if($.browser.msie)
		{
			return document.compatMode == "CSS1Compat"? document.documentElement.clientHeight :document.body.clientHeight;
		}
		else
		{
			return self.innerHeight;
		}	
	}
	
	$("#demo img").each(function(){
		$(this).hover(
			function(e){
				clearInterval(MyMar1);
				$("body").append("<div id='preview'><div><img src='"+$(this).attr('name')+"' /><p>"+$(this).attr('title')+"</p></div></div>");
				$("#preview").css({position:"absolute",padding:"4px",border:"1px solid #f3f3f3",backgroundColor:"#eeeeee",bottom:(h()-e.pageY-yOffset)+"px",zIndex:1000});
				$("#preview > div").css({padding:"5px",backgroundColor:"white",border:"1px solid #cccccc"});
				$("#preview > div > p").css({textAlign:"center",fontSize:"12px",padding:"8px 0 3px",margin:"0"});
				
				if(e.pageX < w()/2)
				{
					$("#preview").css({left:e.pageX + xOffset + "px"}).fadeIn("fast");
				}
				else{
					$("#preview").css("right",(w()-e.pageX + yOffset) + "px").fadeIn("fast");	
				}
				$("#preview > div > img").css({width:"300px",height:"300px"}).fadeIn("fast");
			},
			function(){
				
				$("#preview").remove();	
				MyMar1=setInterval(Marquee1,speed);
			}
		).mousemove(function(e)
		{
			clearInterval(MyMar1);
			$("#preview").css("bottom",(h()-e.pageY-yOffset)+"px")
			if(e.pageX < w()/2)
			{
				$("#preview").css("left",(e.pageX + yOffset) + "px").css("right","auto");
			}
			else
			{
				$("#preview").css("right",(w()-e.pageX + yOffset) + "px").css("left","auto");
			}
			$("#preview > div > img").css({width:"300px",height:"300px"}).fadeIn("fast");
		});									  
	});						   
});
