Jquery. Jwin.js the pop-up layer plug-in code based on jquery _jquery

The code is as follows:

Copy Code code as follows:

(function ($) {
var imgdir = ' images/';//Picture folder path
var autohide=false;//suspended Div is automatically hidden
var hidetype= ' hide '//hidden Way Optional parameters hide, slide, fade
var hidedelay=0;//suspension div Hidden process time used
var hidetime=0;//suspended Div delay hidden time
The div that gets the focus when Var zindex=100;//multiple div is at the top level
var showtype= ' show '; suspension div display options hide, slide, fade
var showtime=0;//suspension div Display the time used by the process
var showdelay=0;//suspension div Delay Display time
The following two variables are used to ensure that when the div is dragged, the position that appears after it is opened is still the first occurrence
var oldtop= ';//save Div first appearance top
var oldleft= ';//save Div first appearance left
$.fn.extend ({
Jwin:function (option) {
var op=$.extend ({
ID: ',//the ID of the suspended div (required)
Title: ',//Heading
Message: ',//display information
ElementID: ',//show the ID of the element
URL: ',//Display page address
Width of width:400,//suspended Div
Height of height:300,//suspended Div
Suspended DIV Display parameters
ShowType: ' Show ',//suspension div display options hide, slide, fade
showtime:0,//the time used by the suspension div display process
showdelay:0,//Suspension div Delay Display time
Suspended Div Hidden parameters
autohide:false,//suspended Div is automatically hidden
Hidetype: ' Hide ',//hidden way Optional parameters hide, slide, fade
hidetime:0,//Suspension div Hidden process time used
hidedelay:0,//Suspension div Auto Hide delay time
},option);

if (op.id== ') {
Alert ("Lack of winid");
Return
}

Autohide=op.autohide;
Hidetype=op.hidetype;
Hidedelay=op.hidedelay;
Hidetime=op.hidetime;
Showtype=op.showtype;
Showtime=op.showtime;
Showdelay=op.showdelay;
zindex=zindex+1;

var winele=$ ("#" +op.id);
if (winele.length==0) {
This.width = parseint (op.width);
This.height = parseint (op.height);
var banner=this. Jwincreatbanner (Op.id,this.width,op.title);
OldTop = This.height >= document.documentElement.clientHeight? 0: (document.documentelement.clientheight-this.height)/2;
OldLeft = This.width >= document.body.clientWidth? 0: (document.body.clientwidth-this.width)/2;

win=$ (' <div id= ' + op.id + ' "></div> ');
Win.css ({' position ': ' absolute ', ' top ': oldtop, ' left ': oldleft, ' width ':(this.width+2), ' zindex ': zindex, ' Display ': ' None '});
win.html (banner);
Win.find ("#close"). Bind (' click ', Function () {$ (this). Jwinclose (op.id);});
Win.find ("#bannerMiddle"). Bind (' MouseDown ', function () {$ (this). Jwinmove (op.id);});

var container=$ (' <div id= ' + op.id + ' _con ' ></div> ');
Container.css ({' float ': ' Left ', ' width ': +this.width, ' height ': this.height, ' word-break ': ' Break-all ', ' overflow-x ': ' Hidden ', ' overflow-y ': ' auto ', ' border ': ' 1px solid #1972e1 ', ' background-color ': ' #FFF ', ' Clear ': ' both '});

if (op.message.length>0) {
Container.append (Op.message);
}
else if (op.url.length>0) {
var iframe=$ (' <iframe frameborder= "0" ></iframe> ");
Iframe.css ({' width ': ' 100% ', ' height ': ' 100% ', ' overflow ': ' Visible ', ' border ': ' 0 '});
Iframe.attr (' src ', op.url);
Container.append (IFRAME);
}
else if (op.elementid.length>0) {
var element=$ ("#" +op.elementid);
if (Element) {
Container.append (Element);
Element.show ();
}
}

Win.append (container);
$ (document.body). Append (Win);
This. Jwinshow (Win);

Whether to set automatic shutdown
if (autohide) {
This. Jwinhide (op.id);
}
}
else{
Winele.css ({' ZIndex ':(winele.css (' zindex ') +2), ' top ': oldtop, ' Left ': oldleft} ';
This. Jwinshow (Winele);
}
},

Create a title
Jwincreatbanner:function (Winid,width,title) {
var bannerimddlewidth = width-47;//Drag part div width to total width minus side fillet width, close button width
var banner = ' <div style= ' folat:left;width: ' + (width+2) + '; Clear:both;font-size:14px;font:arial,helvetica, Sans-serif;color: #FFF; " > ';
Banner = ' <div style= ' width:14px;height:30px;line-height:30px;float:left;background:url (' +imgdir+ ' Windows_ banner_left.gif) no-repeat; " ></div> ';
Banner + + "<div id=" Bannermiddle "style=" width: ' +bannerimddlewidth+ ' px;height:30px;float:left;line-height:30px; Cursor:move;float:left;text-align:left;background:url (' +imgdir+ ' windows_banner.gif) repeat-x; "> ' +title+ ' < /div> ';
Banner = ' <div style= ' width:21px;height:30px;line-height:30px;float:left;background:url (' +imgdir+ ' Windows_ banner.gif) repeat-x; " ></div>";
Banner = ' <div style= ' width:14px;height:30px;line-height:30px;float:left;background:url (' +imgdir+ ' Windows_ banner_right.gif) no-repeat; " ></div> ';
Banner + = ' </div> ';
return banner;
},

Drag
Jwinmove:function (Winid) {
var Floatwin=document.getelementbyid (Winid);
zindex=zindex+1;
Floatwin.style.zindex=zindex;
o=window.event.srcelement| | Window.event.target;
var d=document;
var a=window.event;
var x=a.layerx?a.layerx:a.offsetx;
var y=a.layery?a.layery:a.offsety;
if (o.setcapture) {
O.setcapture ();
}
else if (window.captureevents) {
Window.captureevents (event.mousemove| Event.mouseup);
}

D.onmousemove=function (a) {
if (!a) a=window.event;
if (!a.pagex) A.pagex=a.clientx;
if (!a.pagey) A.pagey=a.clienty;
var tx=a.pagex-x,ty=a.pagey-y;
var maxx=document.documentelement.clientwidth-floatwin.clientwidth;
var maxy=document.documentelement.clientheight-floatwin.clientheight;
tx= (tx<0) 0:tx;
Ty= (ty<0) 0:ty;
tx= (Tx>maxx) maxx:tx;
Ty= (Ty>maxy) maxy:ty;
FLOATWIN.STYLE.LEFT=TX;
Floatwin.style.top=ty;
};

D.onmouseup=function () {
if (o.releasecapture) {
O.releasecapture ();
}
else if (window.captureevents) {
Window.captureevents (event.mousemove| Event.mouseup);
}
D.onmousemove=null;
D.onmouseup=null;
};
},

Show
Jwinshow:function (Win) {
var t = Showdelay;
Switch (showtype) {
Case ' Slide ':
settimeout (function () {Win.slidedown (showTime);}, T);
Break
Case ' fade ':
settimeout (function () {Win.fadein (showTime);},t);
Break
Default
settimeout (function () {win.show ();},t);
Break
}
},

Hide
Jwinhide:function (winid,atonce) {
var win = $ ("#" +winid);
var t = atonce? 0:hidedelay;
Switch (hidetype) {
Case ' Slide ':
settimeout (function () {win.slideup (hidetime);}, T);
Break
Case ' fade ':
settimeout (function () {win.fadeout (hidetime);},t);
Break
Default
settimeout (function () {win.hide ();},t);
Break
}
},

Shut down
Jwinclose:function (Winid) {
This. Jwinhide (winid,true);
}
});
}) (JQuery)