Copy Code code as follows:
<script type= "Text/javascript" src= "Http://img.zzl.com/script/jquery/jquery-1.4.2.min.js" ></script>
<script type= "Text/javascript" >
$ (function () {
$ ("#open"). Click (function () {
OpenDialog (A1); Call, write the DIV's ID directly
});
});
var opendialog = function (o) {
var dialog = new Zzldialog (o);
Dialog.open ();
}
var zzldialog = function (o) {
This.init = function () {
/* Dialog Box initialization * *
var XBox = ' \
<div id= "Mask"/>\
<div id= "Wai" >\
</div>\
<div id= "nie" >\
<table>\
<thead>\
<tr>\
<td>\
Shadow pop-up box \
</td>\
<td>\
</td>\
</tr>\
</thead>\
<tbody>\
<tr>\
<TD colspan= "2" > ' + $ (o). HTML () + ' \
</td>\
</tr>\
</tbody>\
</table>\
</div>\
';
$ (document.body). Append (XBox);
};
This.cssinit = function () {
/* CSS Initialization * *
$ ("#wai"). css ({"padding": "10px", "Background": "#000", "Filter": "Alpha (opacity= ')", "position": "Absolute"});
$ ("#nie"). css ({"position": "Absolute", "Z-index": "1000"});
$ ("#nie >table"). CSS ({"Border": "1px solid RGB (55,119,188)", "Border-collapse": "Collapse", "Background": "#fff"});
$ ("#nie >table>thead>tr"). CSS ({"Background": "RGB (0,94,172)", "Color": "#fff", "height": "30px", "Font-size" : "14px", "font-weight": "Bold"});
$ ("#nie >table"). Find ("TD"). CSS ({"padding": "5"});
/* Internal main position * *
$ ("#nie"). CSS ({"Top": "50px"});
$ ("#nie"). CSS ({"Left": "50px"});
/* Close button/*
var $close = $ ("#nie >table>thead"). Find ("TD"). Next ("TD");
$close. HTML ("<span> close </span>");
$close. css ({"text-align": "Right", "Padding-right": "5px"});
$close. Find ("span"). CSS ({"Font-weight": "Normal", "cursor": "Hand"});
$close. Find ("span"). Click (function () {new Zzldialog (). closes ();});
* * External shadow added, and position and size are controlled by internal content.
$ ("#wai"). CSS ({"width": ($ ("#nie >table"). Width () +) + "px", "height": ($ ("#nie >table"). Height () + + "px"});
$ ("#wai"). CSS ({"Top": $ ("#nie"). Position (). Top-8 + "px", "left": $ ("#nie"). Position (). Left-8 + "px", "Z-index": $ ("#n ie "). CSS (" Z-index ")});
$ ("#wai"). Corner ("5px"); Rounded Corners
};
This.open = function () {
This.init ();
This.cssinit ();
This.shadow ();
};
This.shadow = function () {
This.event_b_show ();
if (window.attachevent) {
Window.attachevent (' onresize ', this.event_b);
Window.attachevent (' onscroll ', this.event_b);
}
else {
Window.addeventlistener (' Resize ', this.event_b, false);
Window.addeventlistener (' scroll ', this.event_b, false);
}
};
This.event_b = function () {
var Oshadow = $ (' #mask ');
if (Oshadow.css ("display")!= "None") {
if (this.event_b_show) {
This.event_b_show ();
}
}
};
this.closes = function () {
var Oshadow = $ (' #mask ');
Oshadow.css ({' Display ': ' None '});
$ ("#wai"). Remove ();
$ ("#nie"). Remove ();
};
This.event_b_show = function () {
var Oshadow = $ (' #mask ');
Oshadow.css ({' position ': ' absolute ', ' Display ': ', ' opacity ': ' 0.1 ', ' filter ': ' Alpha (opacity=10) ', ' Background ': ' # 000 '});
var sclientwidth = parent? Parent.document.body.offsetWidth:document.body.offsetWidth;
var sclientheight = parent? Parent.document.body.offsetHeight:document.body.offsetHeight;
var sscrolltop = parent? (Parent.document.body.scrollTop + parent.document.documentElement.scrollTop): (Document.body.scrollTop + DOCUMENT.DOCUMENTELEMENT.SCROLLTOP);
Oshadow.css ({' Top ': ' 0px ', ' left ': ' 0px ', ' width ': sclientwidth + "px", ' Height ': (sclientheight + sscrolltop) + "px"});