JQuery Modal Box Positioning

Question

Alright. I am using a Modal box pop up window to display business details of a dynamic table. This table is very long. Everything works right with the modal box, but if they are say scrolled to the bottom of the page, it always opens the Modal box at the very top of the page. So they would have to do a lot of scrolling back down this way.

I am currently using this code to center my modal box.

function centerPopup(x){
    //request data for centering
    var windowWidth = document.documentElement.clientWidth;
    var windowHeight = document.documentElement.clientHeight;
    var popupHeight = $("#popup" + x).height();
    var popupWidth = $("#popup" + x).width();
    //centering
    $("#popup" + x).css({
        "position": "absolute",
        "top": windowHeight/2-popupHeight/2,
        "left": windowWidth/2-popupWidth/4
    });
    //only need force for IE6

    $('#backgroundPopup').css({
        "height": windowHeight
    });

}

I don't know if there is something in this code that is effecting it. A work around would be to have to scroll down to where they were previously but I couldn't find much documentation on .position.

Answer 1

http://www.west-wind.com/weblog/posts/459873.aspx

This guy built a plugin that centers any elements in the page by adding a .centerInClient. Very slick. Awesome time saver.