A better way to center dialog

<div style="height:2000px">
<div id="dialog" title="Dialog Title" style="border:1px solid blue;width:300px;height:20px;background-color: yellow">I'm a dialog</div>

<script src="http://code.jquery.com/jquery-1.8.2.js"></script>   

<script type="text/javascript" >

$(window).scroll(ctrl_dialog_position);

function ctrl_dialog_position() {
    var cur_window_width = window.innerWidth||document.documentElement.clientWidth;
    var cur_window_height = window.innerHeight || document.documentElement.clientHeight;
    var t_d_w = $("#dialog").width();
    var t_d_h = $("#dialog").height();

    $("#dialog").css("position", "absolute");
    $("#dialog").css("z-index", "1");

    if(cur_window_width > t_d_w) {
        $("#dialog").css("left", (cur_window_width / 2 - t_d_w / 2) + "px");
    } else {
        $("#dialog").css("left", "0px");
    }
    var dy = document.body.scrollTop || document.documentElement.scrollTop;

  if(cur_window_height > t_d_h) {
        $("#dialog").css("top", dy+(cur_window_height / 2 - t_d_h / 2) + "px");
    } else {
        $("#dialog").css("top", dy+"px");
    }

}

</script>

</div>