Как вынудить расположенные элементы остаться скручивание жгутов видимая область браузера?

У меня есть сценарий, который вставляет "раскрывающиеся" элементы в DOM. Это устанавливает их top и left свойства CSS относительно координат мыши на событии щелчка. Это работает отлично за исключением того, что высота их "раскрывается", элементы являются переменными, и некоторые из них расширяются вне видимой области окна браузера. Я хотел бы избежать этого.

Вот то, что я имею до сих пор

<script type="text/javascript">
    $(function () {
        $("area").click(function (e) {
            e.preventDefault();

            var offset = $(this).offset();
            var relativeX = e.pageX - offset.left;
            var relativeY = e.pageY - offset.top;

            // 'responseText' is the "popup" HTML fragment
            $.get($(this).attr("href"), function (responseText) {
                $(responseText).css({
                    top: relativeY,
                    left: relativeX
                }).appendTo("#territories");

                // Need to be able to determine
                // viewable area width and height
                // so that I can check if the "popup" 
                // extends beyond.

                $(".popup .close").click(function () {
                    $(this).closest(".popup").remove();
                });
            });
        });
    });
</script>