ModalBox + DLE

#osx-modal-content, #osx-modal-data {display:none;}
#osx-overlay {background-color:#000; cursor:wait;}
#osx-container {background-color:#eee; color:#000; font: 16px/24px "Lucida Grande",Arial,sans-serif; padding-bottom:4px; width:600px; -moz-border-radius-bottomleft:6px; -webkit-border-bottom-left-radius:6px; -moz-border-radius-bottomright:6px; -webkit-border-bottom-right-radius:6px; border-radius:0 0 6px 6px; -moz-box-shadow:0 0 64px #000; -webkit-box-shadow:0 0 64px #000; box-shadow:0 0 64px #000;}
#osx-container a {color:#ddd;}
#osx-container #osx-modal-title {color:#000; background-color:#ddd; border-bottom:1px solid #ccc; font-weight:bold; padding:6px 8px; text-shadow:0 1px 0 #f4f4f4;}
#osx-container .close {display:none; position:absolute; right:0; top:0;}
#osx-container .close a {display:block; color:#777; font-weight:bold; padding:6px 12px 0; text-decoration:none; text-shadow:0 1px 0 #f4f4f4;}
#osx-container .close a:hover {color:#000;}
#osx-container #osx-modal-data {font-size:12px; padding:6px 12px;}
#osx-container h2 {margin:10px 0 6px;}
#osx-container p {margin-bottom:10px;}
#osx-container span {color:#777;}

(function(d){var k=d.browser.msie&&parseInt(d.browser.version)===6&&typeo
f window.XMLHttpRequest!=="object",m=d.browser.msie&&parseInt(
d.browser.version)===7,l=null,f=[];d.modal=function(a,b){ret
urn d.modal.impl.init(a,b)};d.modal.close=function(){d.modal.impl.cl
ose()};d.modal.focus=function(a){d.modal.impl.focus(a)};
d.modal.setContainerDimensions=function(){d.modal.impl.setContainerDimen
sions()};d.modal.setPosition=function(){d.modal.impl.setPosition
()};d.modal.update=function(a,b){d.modal.impl.update(a,
b)};d.fn.modal=function(a){return d.modal.impl.init(this,a)};d.modal.defaults={appendTo:"body"
,focus:true,opacity:50,overlayId:"simplemodal-overlay",overl
ayCss:{},containerId:"simplemodal-container",containerCss:{}
,dataId:"simplemodal-data",dataCss:{},minHeight:null,minWidt
h:null,maxHeight:null,maxWidth:null,autoResize:false,autoPositio
n:true,zIndex:1E3,close:true,closeHTML:'<a class="modalCloseImg" title="Close"></a>',closeClass:"simplemodal-clos
e",escClose:true,overlayClose:false,position:null,
persist:false,modal:true,onOpen:null,onShow:null,onClose:nul
l};d.modal.impl={d:{},init:function(a,b){var c=this;if(c.d.data)return false;l=d.browser.msie&&!d.boxModel;c.o=d.extend({},d.modal.defaults
,b);c.zIndex=c.o.zIndex;c.occb=false;if(typeof a==="object"){a=a instanceof jQuery?a:d(a);c.d.placeholder=false;if(a.parent().parent
().size()>0){a.before(d("<span><
/span>").attr("id","simplemodal-placeholder")
;.css({display:"none"}));c.d.placeholder=true;c.display=
a.css("display");if(!c.o.persist)c.d.orig=
a.clone(true)}}else if(typeof a==="string"||typeof a==="number")a=d("<div></div>").html
(a);else{alert("SimpleModal Error: Unsupported data type: "+typeof a);return c}c.create(a);c.open();d.isFunction(c.o.onShow)&&
;c.o.onShow.apply(c,[c.d]);return c},create:function(a){var b=this;f=b.getDimensions();if(b.o.modal&&k)b.d.iframe=d&
#40;'<iframe src="javascript:false;"></iframe>').css(
;d.extend(b.o.iframeCss,{display:"none",opacity:0,position&#
58;"fixed",height:f[0],width:f[1],zIndex:b.o
.zIndex,top:0,left:0})).appendTo(b.o.appendTo);
b.d.overlay=d("<div></div>").attr("id
4;,b.o.overlayId).addClass("simplemodal-overlay").css(d.
extend(b.o.overlayCss,{display:"none",opacity:b.o.opacity/10
0,height:b.o.modal?f[0]:0,width:b.o.modal?f[1]:0
,position:"fixed",left:0,top:0,zIndex:b.o.zIndex+1})
).appendTo(b.o.appendTo);b.d.container=d("<div><
/div>").attr("id",b.o.containerId).addClass("
;simplemodal-container").css(d.extend(b.o.containerCss,{display&
#58;"none",position:"fixed",zIndex:b.o.zIndex+2})
1;.append(b.o.close&&b.o.closeHTML?d(b.o.closeHTML).addClass
(b.o.closeClass):
"").appendTo(b.o.appendTo);b.d.wrap=d("<div>
</div>").attr("tabIndex",-1).addClass("s
implemodal-wrap").css({height:"100%",outline:0,width
:"100%"}).appendTo(b.d.container);b.d.data=a.attr(&#
34;id",a.attr("id")||b.o.dataId).addClass("simpl
emodal-data").css(d.extend(b.o.dataCss,{display:"none
4;})).appendTo("body");b.setContainerDimensions()
;;b.d.data.appendTo(b.d.wrap);if(k||l)b.fixIE()},bindEve
nts:function(){var a=this;d("."+a.o.closeClass).bind("click.simplemodal"
;,function(b){b.preventDefault();a.close()});
a.o.modal&&a.o.close&&a.o.overlayClose&&a.d.overlay.bind
("click.simplemodal",function(b){b.preventDefault();
a.close()});d(document).bind("keydown.simplemodal
4;,function(b){if(a.o.modal&&b.keyCode===9)a.watchTab
0;b);else if(a.o.close&&a.o.escClose&&b.keyCode===27){b.preventDef
ault();a.close()}});d(window).bind("resize.s
implemodal",function(){f=a.getDimensions();a.o.autoResize?a.
setContainerDimensions():a.o.autoPosition&&a.setPosition(
;);if(k||l)a.fixIE();else if(a.o.modal){a.d.iframe&&a.d.iframe.css({height:f[0
],
width:f[1]});a.d.overlay.css({height:f[0],width&
#58;f[1]})}})},unbindEvents:function(){d(".&
#34;+this.o.closeClass).unbind("click.simplemodal");d(do
cument).unbind("keydown.simplemodal");d(window).unbi
nd("resize.simplemodal");this.d.overlay.unbind("click.si
mplemodal")},fixIE:function(){var a=this,b=a.o.position;d.each([a.d.iframe||null,!a.o.modal?null:a.d.o
verlay,a.d.container],function(c,h){if(h){var g=h[0].style;g.position="absolute";if(c<2){g.removeE
xpression("height");g.removeExpression("width");
g.setExpression("height",
'document.body.scrollHeight > document.body.clientHeight ? document.body.scrollHeight : document.body.clientHeight + "px"');g.setExpression("width",'document.body.sc
rollWidth > document.body.clientWidth ? document.body.scrollWidth : document.body.clientWidth + "px"')}else{var e;if(b&&b.constructor===Array){c=b[0]?typeof b[0]==="number"?b[0].toString():b[0]
.replace(/px/,""):h.css("top").replace(/
px/,"");c=c.indexOf("%")===-1?c+' + (t = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + "px"':
parseInt(c.replace(/%/,""))+' * ((document.documentElement.clientHeight || document.body.clientHeight) / 100) + (t = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + "px"';if(b[1]){e=typeof b[1]==="number"?b[1].toString():b[1]
.replace(/px/,"");e=e.indexOf("%")===-1?e+' + (t = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft) + "px"':parseInt(e.replace(/%/,""))+' * ((document.documentElement.clientWidth || document.body.clientWidth) / 100) + (t = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft) + "px"'}}else{c=
'(document.documentElement.clientHeight || document.body.clientHeight) / 2 - (this.offsetHeight / 2) + (t = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + "px"';e='(document.documentElement.clientWidth || document.body.clientWidth) / 2 - (this.offsetWidth / 2) + (t = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft) + "px"'}g.removeExpression("top");g.removeExpression&#
40;"left");g.setExpression("top",
c);g.setExpression("left",e)}}})},focus:function(
;a){var b=this;a=a&&d.inArray(a,["first","last"])
;!==-1?a:"first";var c=d(":input:enabled:visible:"+a,b.d.wrap);setTim
eout(function(){c.length>0?c.focus():b.d.wrap.focus&
#40;)},10)},getDimensions:function(){var a=d(window);return[d.browser.opera&&d.browser.version>&#
34;9.5"&&d.fn.jquery<"1.3"||d.browser.opera&&d.b
rowser.version<"9.5"&&d.fn.jquery>"1.2.6"?a[
0].innerHeight:a.height(),a.width()]},getVal:fun
ction(a,b){return a?typeof a==="number"?a:a==="auto"?0:
a.indexOf("%")>0?parseInt(a.replace(/%/,""&#
41;)/100*(b==="h"?f[0]:f[1]):parseIn
t(a.replace(/px/,"")):null},update:function(
a,b){var c=this;if(!c.d.data)return false;c.d.origHeight=c.getVal(a,"h");c.d.origWidth=c.getVal(
b,"w");c.d.data.hide();a&&c.d.container.css("
;height",a);b&&c.d.container.css("width",b);c.se
tContainerDimensions();c.d.data.show();c.o.focus&&c.focu
s();c.unbindEvents();c.bindEvents()},setContainerDimensi
ons:function(){var a=this,b=k||m,c=a.d.origHeight?a.d.origHeight:d.browser.opera?
a.d.container.height():a.getVal(b?a.d.container[0].curre
ntStyle.height:a.d.container.css("height"),"h");
b=a.d.origWidth?a.d.origWidth:d.browser.opera?a.d.container.width()&
#58;a.getVal(b?a.d.container[0].currentStyle.width:a.d.container
.css("width"),"w");var h=a.d.data.outerHeight(true),g=a.d.data.outerWidth(true);a.d.ori
gHeight=a.d.origHeight||c;a.d.origWidth=a.d.origWidth||b;var e=a.o.maxHeight?a.getVal(a.o.maxHeight,"h"):null,i=a.o.maxWi
dth?a.getVal(a.o.maxWidth,"w"):null;e=e&&e<f[
;0]?e:f[0];i=i&&i<
f[1]?i:f[1];var j=a.o.minHeight?a.getVal(a.o.minHeight,"h"):"auto";c
=c?a.o.autoResize&&c>e?e:c<j?j:c:h?h>e?e:a.o
.minHeight&&j!=="auto"&&h<j?j:h:j;e=a.o.minW
idth?a.getVal(a.o.minWidth,"w"):"auto";b=b?a.o.autoR
esize&&b>i?i:b<e?e:b:g?g>i?i:a.o.minWidth&am
p;&e!=="auto"&&g<e?e:g:e;a.d.container.css({
height:c,width:b});a.d.wrap.css({overflow:h>c||g>b?&
#34;auto":"visible"});a.o.autoPosition&&a.setPositio
n()},setPosition:function(){var a=this,b,c;b=f[0]/2-a.d.container.outerHeight(true)/2;c=f[1&
#93;/2-a.d.container.outerWidth(true)/
2;if(a.o.position&&Object.prototype.toString.call(a.o.position&#
41;==="[object Array]"){b=a.o.position[0]||b;c=a.o.position[1]||c}e
lse{b=b;c=c}a.d.container.css({left:c,top:b})},watchTab:func
tion(a){var b=this;if(d(a.target).parents(".simplemodal-container"&#
41;.length>0){b.inputs=d(":input:enabled:visible:
;first, :input:enabled:visible:last",b.d.data[0]);if(
;!a.shiftKey&&a.target===b.inputs[b.inputs.length-1]||a.shiftKey
&&a.target===b.inputs[0]||b.inputs.length===0){a.preventDefa
ult();b.focus(a.shiftKey?"last":
"first")}}else{a.preventDefault();b.focus()}},open&#
58;function(){var a=this;a.d.iframe&&a.d.iframe.show();if(d.isFunction(a.o
.onOpen))a.o.onOpen.apply(a,[a.d]);else{a.d.overlay.show
();a.d.container.show();a.d.data.show()}a.o.focus&&a
mp;a.focus();a.bindEvents()},close:function(){var a=this;if(!a.d.data)return false;a.unbindEvents();if(d.isFunction(a.o.onClose)&&
;!a.occb){a.occb=true;a.o.onClose.apply(a,[a.d])}else{if(
;a.d.placeholder){var b=d("#simplemodal-placeholder");if(a.o.persist)b.replace
With(a.d.data.removeClass("simplemodal-data").css("d
isplay",
a.display));else{a.d.data.hide().remove();b.replaceWith&
#40;a.d.orig)}}else a.d.data.hide().remove();a.d.container.hide().remove(
;);a.d.overlay.hide();a.d.iframe&&a.d.iframe.hide().
remove();setTimeout(function(){a.d.overlay.remove();
a.d={}},10)}}}})(jQuery);

jQuery(function ($) {
var OSX = {
container: null,
init: function () {
$("a.osx").click(function (e) {
e.preventDefault(); 

$("#osx-modal-content").modal({
overlayId: 'osx-overlay',
containerId: 'osx-container',
closeHTML: null,
minHeight: 80,
opacity: 65, 
position: ['0',],
overlayClose: true,
onOpen: OSX.open,
onClose: OSX.close
});
});
},
open: function (d) {
var self = this;
self.container = d.container[0];
d.overlay.fadeIn('slow', function () {
$("#osx-modal-content", self.container).show();
var title = $("#osx-modal-title", self.container);
title.show();
d.container.slideDown('slow', function () {
setTimeout(function () {
var h = $("#osx-modal-data", self.container).height()
+ title.height()
+ 20; // padding
d.container.animate(
{height: h}, 
200,
function () {
$("div.close", self.container).show();
$("#osx-modal-data", self.container).show();
}
);
}, 300);
});
})
},
close: function (d) {
var self = this; // this = SimpleModal object
d.container.animate(
{top:"-" + (d.container.height() + 20)},
500,
function () {
self.close(); // or $.modal.close();
}
);
}
};

OSX.init();

});

<a href='#' class='osx'>[group=5]Вход[/group][not-group=5    
3;Панель управления[/not-group]</a>

<div id="osx-modal-content">
<div id="osx-modal-title">[group=5]Форма входа[/group][not-group=5]Панель управления[/not-group]</div>
<div class="close"><a href="#" class="simplemodal-close">x</a></div>
<div id="osx-modal-data">

<p><button class="simplemodal-close">Закрыть</button> <span>(или нажмите Esc)</span></p>
</div>
</div>