<script type="text/javascript">
//Вынес переменные за пределы функций, для удобства правки
//id дива для затемнения.
var bg_fon = "#backgroundPopup";
//id всплывающего дива
var fly_block = "#fly_bl"
//id зоны активации всплывающего окна
var key_on = "#key_on"
//id зоны закрытия всплывающего окна
var key_off = "#key_off"
//загружаем всплавающее окно
function loadPopup(){
//черный прозрачный фон на сайт при необходимости, можно вписать неводимыл в шаблон, можно сделать
// в функции predPopup, я не делал поэтому не описываю, если затенять сайт не надо то код связанный с #backgroundPopup
// убираем.
                $(bg_fon).css({
                        "opacity": "0.1"
                });
                $(bg_fon).fadeIn("2000");
                $(fly_block).fadeIn("slow");
}
//отключаем окно
function disablePopup(){
                $(bg_fon).fadeOut("slow");
                $(fly_block).fadeOut("slow");
}

function predPopup(){
//Вычисляем рабочюю зону экрана для расчетов (например чтобы плавающий блок по центру экрана разместить)
        var windowWidth = screen.availWidth;
    var windowHeight = screen.availHeight;
//Посчитал размеры плавающего блока
        var popupWidth = 200;
        var popupHeight = 200;
       
//Далее настраиваем свои CSS селекторы на разные HTML - элементы. Можем добавить своих настроек.
        $(fly_block).css({
                "background" : "#fff",
                "height": popupHeight,
                "width": popupWidth,
        "position": "absolute",
                "top": windowHeight*0.1,
                "left": "20px",
        "z-index": "10"
        });
       
        $(bg_fon).css({
                "background" : "#000",
                "display" : "block",
                "position": "absolute",
                "top" : "0px",
                "left" : "0px",
                "height": "100%",
        "z-index": "9",
                "width": "100%"
        });
}

jQuery(document).ready(function(){ //все что внутри срабатывает только при готовности документа
//прячу плавающий блок, можно вынести в CSS
        $(fly_block).css({
        "display": "none"
        });

jQuery(key_on).click(function(){ // функция вызывается когда объект с id="#key_on" получил событие click
//готовим окно
predPopup();
//выводим окно
loadPopup();
});
jQuery(key_off).click(function(){ // функция вызывается когда объект с id="#key_off" получил событие click
disablePopup();// прячем блок
});
//альтернотивное закрытие блока по ESC
$(document).keypress(function(event){
if(event.keyCode==27){
disablePopup();
        }
});
});
</script><?php //далее собственно блок ?>
<div><a id="key_on" title="Всплывающий блок" href="#">Открыть скрытый блок</a></div>
<div id="fly_bl">Прячущийся блок ---- <a id="key_off" title="закрыть" href="#">Х</a></div>
<div id="backgroundPopup">&nbsp;</div>

$(fly_block).html("Твое наполнение дива хоть аяксом,
                   хоть руками, дальше добавил старую
                   кнопоччку из дива - это по желанию"
                   + $(fly_block).html());