var DIALOG_FADE_OUT_DURATION = 300; var dialogCloseImg = null; function showDialogFromUrl(url, width, height, data, callback){ dialog.load(url, data, callback); } function showDialog(id, closeImgId){ var overlay = $('

').css({ 'width':$(window).width(), 'height':$(window).height() + $(window).scrollTop(), 'position':'absolute', 'background-color':'#000', 'top':'0px', 'left':'0px', 'opacity':'0.60' }).appendTo($('body')); var width = $('#' + id).outerWidth(); var height = $('#' + id).outerHeight(); var top = 200 + $(window).scrollTop(); var left = ($(window).width() - width) / 2; var dialog = $('

').css({ 'position':'absolute', 'width':width, 'height':height, 'top':top, 'left':left }).appendTo($('body')); //The dialog already exists on the page and is not visible so show and move to the dialog container $('#' + id).show().appendTo(dialog); if(!closeImgId) closeImgId = 'dialog_close_img'; dialogCloseImg = $('

') .css({'position':'absolute','top':(top - 12), 'left':(left + width - 12)}) .addClass('link') .bind('click', function(){ //Move the dialog content back to the so we don't remove it from the DOM in the following steps $(this).fadeOut(200); dialog.fadeOut(200); overlay.fadeOut(200, function () { $('#' + id).hide().appendTo($('body')); $(this).remove(); dialog.remove(); overlay.remove(); }); }) .appendTo($('body')); } function closeDialog(){ if(dialogCloseImg) dialogCloseImg.trigger('click'); }