Position dialog relative to radio button

Positions a jquery ui dialog relative to radio buttons.

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css">
<input type="radio" name="radioImage" id="radio1" class="opendialog" />Images Right
<input type="radio" name="radioImage" id="radio2" class="opendialog" />Images Left


<div id="dialog1" class="dialog">
    <p> My positioned dialog 1</p>
</div>  
<div id="dialog2" class="dialog">
    <p> My positioned dialog 2</p>
</div>

JavaScript

function getNum(element, attrPrefix) {
    //set prefix, get number
    var prefix = attrPrefix;
    var num = element.attr("id").substring((prefix.length));
    return num;
}

$(function() {
    $(".dialog").dialog({
        autoOpen: false,
        show: 'fade',
        hide: 'fade',
        modal: false,
        width: 320,
        minHeight: 180,
        buttons: {
            "Close": function() {
                $(this).dialog("close");
            }
        }
    });

    $(".opendialog").change(function() {
        $(".dialog").dialog("close");
        if ($(this).is(":checked")) {
            var num = getNum($(this), "radio");
            positionDialog($("#radio1"), $("#dialog" + num));
            $("#dialog" + num).dialog("open");
        }
        return false;
    });

    function positionDialog(base, dialog) {
        linkOffset = base.position();
        linkWidth = base.width();
        linkHeight = base.height();
        scrolltop = $(window).scrollTop();
        dialog.dialog("option", "position", [(linkOffset.left) + linkWidth / 2, linkOffset.top + linkHeight - scrolltop]);
    }



    $(window).resize(function() {
        var openDialog = $(".dialog" + getNum($(".opendialog:checked")), "radio");
        positionDialog($("#radio1"), openDialog);
    });

    $(window).scroll(function() {
        var openDialog = $(".dialog" + getNum($(".opendialog:checked")), "radio");
        positionDialog($("#radio1"), openDialog);
    });
});