function addZoom(oElement)
{
    try
    {
        var strElementId = oElement.getAttribute("id");
        var oZoomElement = document.getElementById(strElementId+"Zoom");

        if(oZoomElement != null)
        {
            if(oElement.addEventListner)
            {
                oElement.addEventListner("mouseover", showZoom);
                oElement.addEventListner("mousemove", doZoom);
                oElement.addEventListner("mouseoff", hideZoom);
            }
            else
            {
                oElement.attachEvent("onmouseover", showZoom);
                oElement.attachEvent("onmousemove", doZoom);
                oElement.attachEvent("onmouseoff", hideZoom);
            }
        }
    }
    catch(oError)
    {
        alert("An error was encountered.\nZooming feature was not enabled.");
    }
}

function showZoom(oElement,oEvent)
{
    var zoomBox = document.getElementById(oElement.getAttribute("id")+"Zoom");
    var zoomContent = zoomBox.firstChild;

    var relX = (oEvent.pageX - 100 - oElement.x)*2;
    var relY = (oEvent.pageY - 50 - oElement.y)*2;

    zoomContent.style.position = "relative";
    zoomContent.style.top = "-"+ relY +"px";
    zoomContent.style.left = "-"+ relX +"px";

    zoomBox.style.display = "block";
    zoomBox.style.visibility = "visible";
    zoomBox.style.background = "transparent";
    zoomBox.style.border = "1px solid red";
    zoomBox.style.overflow = "hidden"
    zoomBox.style.position = "absolute";
    zoomBox.style.top = oEvent.pageY+15 +"px";
    zoomBox.style.left = oEvent.pageX-100 +"px";
    zoomBox.style.height = "100px";
    zoomBox.style.width = "200px";
}

function moveZoom(oElement,oEvent)
{
    var zoomBox = document.getElementById(oElement.getAttribute("id")+"Zoom");
    var zoomContent = zoomBox.firstChild;

    var relX = (oEvent.pageX - 50 - oElement.x)*2;
    var relY = (oEvent.pageY - 25 - oElement.y)*2;

    zoomContent.style.top = "-"+ relY +"px";
    zoomContent.style.left = "-"+ relX +"px";

    zoomBox.style.top = oEvent.pageY+15 +"px";
    zoomBox.style.left = oEvent.pageX-100 +"px";
}

function hideZoom(oElement,oEvent)
{
    var zoomBox = document.getElementById(oElement.getAttribute("id")+"Zoom");

    zoomBox.style.display = "none";
    zoomBox.style.visibility = "hidden";
}