Saturday, September 15, 2012

Google image pop up effects in javascript

//Google image pop up effects:
// imgOld is Old image element
// imgNew is New Image element which is going to be show as it is
// Following function return left and top position of pop up dialog div in which we have to bind New image element

function getDivPos(imgOld,imgNew)
{
    var offset= imgOld.getClientRects();
   
   
    var left=offset[0].left-(imgNew.width/2-imgOld.width/2);
    var top=offset[0].top-(imgNew.height/2-imgOld.height/2);
   
    if((top + imgNew.height) > document.documentElement.clientHeight)
    {
    top= top - (top + imgNew.height - document.documentElement.clientHeight);
    }
    if((left + imgNew.width) > document.documentElement.clientWidth)
    {
      left=left - (left + imgNew.width- document.documentElement.clientWidth);
    }
   
    if(0> left)
    {
       left=document.documentElement.scrollLeft;
    }
    else
    {
       left=left+document.documentElement.scrollLeft;
    }
    if(0>top)
    {
      top=document.documentElement.scrollTop;
    }
    else
    {
      top=top+document.documentElement.scrollTop;
    }
   
       
    left=Math.round(left);
    top=Math.round(top);
   
    return ({"left":left,"top":top});
}