Relocate and resize web links when using zoom in and out.

Relocate and resize web links when using zoom in and out.

    This is a flipbook I have the following code that supposed to relocate the links when page change size or orientation on the iPad. I using ajax to an array which get the links. The links write to the page and the green overlay shows where the links are. First images is what happens when use the code below. I need to adjust the links over -25 and 0 this what I am getting all links move and overlap each other. If you look at the second image you will see the original links location. I need for it move over with overlapping. 

    1. // Left side
    2.         function GoSizeLeft(page) {

        1. // using the original demision of the set from database
    3.             var rel = $("#Page-" + page).attr("OrigDem").split(',');
    4. //  take the width and height of the page books.
    5.             var width = $("#Page-" + page.toString()).width();
    6.             var height = $("#Page-" + page.toString()).height();
    7. // split and parse out the width and height
    8.             var OrigWidth = parseFloat(rel[0]);
    9.             var OrigHeight = parseFloat(rel[1]);
    10. // divide and the page height and width from the original
    11.             var HChange = height / OrigHeight;
    12.             var WChange = width / OrigWidth;
    13. // get the links for the left page and get rectangle coordinates
    14.             $(LeftHotLinks).each(function () {
    15.                 var relCoords = $(LeftHotLinks).attr("rel");
    16.                 var arryCoords = relCoords.split(",");

    17.                 //Get link Values 
    18.                 var OrgX = arryCoords[0];
    19.                 var OrgY = arryCoords[1];
    20.                 var OrgW = arryCoords[2];
    21.                 var OrgH = arryCoords[3];

    22.                 //Calculate new values 
    23.                 var newLeft = OrgX * WChange;
    24.                 var newTop = OrgY * HChange;
    25.                 var NewWidth = OrgW * WChange;
    26.                 var NewHeight = OrgH * HChange;
    27.                 $("#Page-" + page.toString()).append($(this).css("left", newLeft.toString() - 25 + "px", "top", newTop.toString() + "px"));
    28.             });
    29.         }











    This is the image when I run dynamic links with the code. 
    Without the code below.