function showProductImage(strImage, parentObj){
    divObj = document.getElementById("divProductImage");
    
    divObj.innerHTML = "<table style='border-collapse: collapse;' id='tableProductImage'>"+
    "<tr><td style='vertical-align: middle; padding: 10px'>"+
    "<img src='" + strImage + "' border='0' alt='' align='center'>"+
    "</td></tr></table>";

    popup(divObj, parentObj);
}

function hideProductImage(){
    divObj = document.getElementById("divProductImage");
    unpop(divObj);
}

function popup( obj , parentObj) {
    with( obj.style ) {
        display = "block";
        position = "absolute";
    }

	setPreviewLocation(parentObj)
}

function setPreviewLocation(parentObj) {
	var posX = 0;
	var posY = 0;

	/*
	if (!e) var e = window.event;
	
	if (e.pageX || e.pageY) 	{
		posX = e.pageX;
		posY = e.pageY;
	}
	else if (e.clientX || e.clientY) 	{
		posX = e.clientX + document.body.scrollLeft	+ document.documentElement.scrollLeft;
		posY = e.clientY + document.body.scrollTop	+ document.documentElement.scrollTop;
	}
	*/

	posX = findPosX(parentObj) + 200;
	posY = findPosY(parentObj) + 200;

	divObj = document.getElementById("divProductImage");
	tableObj = document.getElementById("tableProductImage");

	tableW = tableObj.offsetWidth;
	tableH = tableObj.offsetHeight;
	winW = document.body.offsetWidth;
	winH = document.body.offsetHeight;

	if(posY + tableH > winH){
		posY -= tableH;
	}

	if(posX + tableW > winW){
		posX -= tableW;
		posX -= 200;
	}

	with( divObj.style ) {
		left = posX;
		top = posY;
	}
}


function unpop( obj ) {
    obj.style.display = "none";
}

function findPosX(obj)
{
var curleft = 0;
if(obj.offsetParent)
	while(1) 
	{
	  curleft += obj.offsetLeft;
	  if(!obj.offsetParent)
		break;
	  obj = obj.offsetParent;
	}
else if(obj.x)
	curleft += obj.x;
return curleft;
}

function findPosY(obj)
{
var curtop = 0;
if(obj.offsetParent)
	while(1)
	{
	  curtop += obj.offsetTop;
	  if(!obj.offsetParent)
		break;
	  obj = obj.offsetParent;
	}
else if(obj.y)
	curtop += obj.y;
return curtop;
}