/*
* Create a pop-up div window.
1, Interface Description: Divwindow (id,title,width,height,content) constructor, create a pop-up object
Parameter: ID popup window ID;
Title: Pop-up window header name;
Width: Pop-up window widths
Height: Pop-up window height
Content: Pop-up window display contents
2, Interface Description: Closedivwindow (ID) Close the window
Parameters: ID Pop-up ID
3, Interface Description: Setpopuptoptitlefontcolor (popuptoptitlefontcolor) Set pop-up window title font color
Parameters:
4, Interface Description: Setpopuptopbgcolor (tbgcolor) Set pop-up window title background color
5, Interface Description: Setpopupcolor (bordercolor,bgcolor,tfontcolor,cbgcolor,fcolor) Settings pop-up window style, including the title bar background, pop-up window border color, content form background color, Content Form Font Color
6, Interface Description: Open ()
How to use:
var a = new Divwindow ("1", "Window Test", 580,400, "Welcome to visited my personal website:<br><a href=http:// Www.qqview.com target=_blank>http://www.qqview.com</a><br><ahref=http://www ... qqview.com</ A><BR><BR>THX!!! =) ... "L);
A.setpopuptopbgcolor ("Black", "blue", "white", "white" and "Black");
A.open ();
Generated HTML:
<div id= ' "Window" +id ' ></div> control the background of the Div, so that the background gradually darkened
<div id= ' "WINDOWTOPBG" +id ' >
<div id= ' "windowtop" +id ' >
<span id= ' "Windowtoptitle" +id ' >title</span>
<span id= ' "windowtopoperate" +id ' >maxORmin</span>
<span id= ' "Windowtopclose" +id ' >close</span>
</div>
<div id= ' "windowcontent" +id ' >content</div>
</div>
@author Nieger Dai
@date 2007.11.15
*/
var Isie = (document.all)? True:false;
var Moveable=false;
var topdivbordercolor = "#336699";//Hint window border color
var topdivbgcolor = "#6795B4";//the background color of the caption of the prompt window
var contentbgcolor = "white";//the background color of the Content display window
var contentfontcolor = "BLACK";//content Display window font color
var titlefontcolor = "White"; Pop-up window title font color
var Index=10000;//z-index;
Create pop-up windows, constructors
function Divwindow (id,title,w,h,content)
{
this.id = id;//Window ID
This.zindex = Index +2;
this.title = title;//pop-up window name
This.message = content;//Popup content
this.width = w;//pop-up window width
this.height = h;//pop-up window height
This.left = (document.body.clientWidth)? (document.body.clientwidth-this.width)/2:0;//pop-up window position, from the left side of the screen
This.top = (document.body.clientHeight)? (document.body.clientheight-this.height)/2:0;//pop-up window position, from the top of the screen
This.init = init;
This.init ();
}
Create a pop-up window based on the constructor setting the initial value
Divwindow.prototype = {
Set pop-up window title font color
Setpopuptoptitlefontcolor:function (Tfontcolor)
{
Titlefontcolor = Tfontcolor;
},
Set pop-up window title background color
Setpopuptopbgcolor:function (Tbgcolor)
{
Topdivbgcolor = Tbgcolor;
},
Set pop-up window style, including title bar background, pop-up window border color, content form background color, content form font color
Setpopupcolor:function (Bordercolor,bgcolor,tfontcolor,cbgcolor,fcolor)
{
Topdivbordercolor = bordercolor;
Topdivbgcolor = bgcolor;
Titlefontcolor = Tfontcolor;
Contentbgcolor = Cbgcolor;
Contentfontcolor = Fcolor;
},
Open a pop-up window
Open:function ()
{
var swidth,sheight;
Swidth=document.body.clientwidth;
Sheight=document.body.clientheight;
var bgobj=document.createelement ("div");
Bgobj.setattribute (' id ', ' window ' +this.id);
var stylestr= "Top:0px;left:0px;position:absolute;background: #245; width:" +swidth+ "Px;height:" +sheight+ "PX;";
stylestr+= (Isie)? " Filter:alpha (opacity=0); ":" opacity:0; ";
BGOBJ.STYLE.CSSTEXT=STYLESTR;
Document.body.appendChild (Bgobj);
To darken the background gradually
Showbackground (bgobj,25);
pop-up window box body background container
var windowtopbgdiv = document.createelement ("div");
Windowtopbgdiv.setattribute (' id ', ' WINDOWTOPBG ' +this.id);
WindowTopBgDiv.style.position = "absolute";
WindowTopBgDiv.style.zIndex = This.zindex;
WindowTopBgDiv.style.width = This.width;
WindowTopBgDiv.style.height = This.height;
WindowTopBgDiv.style.left = This.left;
WindowTopBgDiv.style.top = This.top;
WindowTopBgDiv.style.background = Topdivbgcolor;
WindowTopBgDiv.style.fontSize = "9pt";
WindowTopBgDiv.style.cursor = "Default";
WindowTopBgDiv.style.border = "1px solid" + topdivbordercolor;
Windowtopbgdiv.attachevent ("onmousedown", function () {
if (Windowtopbgdiv.style.zindex!=index)
{
index = index + 2;
var idx = index;
Windowtopbgdiv.style.zindex=idx;
}
});
Pop-up Window Header frame body
var windowtopdiv = document.createelement ("div");
Windowtopdiv.setattribute (' id ', ' windowtop ' +this.id);
WindowTopDiv.style.position = "absolute";
WindowTopDiv.style.background = topdivbgcolor;//"White";
WindowTopDiv.style.color = Titlefontcolor;
WindowTopDiv.style.cursor = "Move";
WindowTopDiv.style.height = 20;
WindowTopDiv.style.width = this.width-2*2;
Start dragging;
Windowtopdiv.attachevent ("onmousedown", function () {
if (event.button==1)
{
Lock the title bar;
Windowtopdiv.setcapture ();
Define the object;
var win = Windowtopdiv.parentnode;
Record mouse and layer position;
x0 = Event.clientx;
y0 = Event.clienty;
X1 = parseint (win.style.left);
Y1 = parseint (win.style.top);
Record color;
Topdivbgcolor = WindowTopDiv.style.backgroundColor;
Change style;
WindowTopDiv.style.backgroundColor = Topdivbordercolor;
Win.style.borderColor = Topdivbordercolor;
moveable = true;
}
});
Stop dragging
Windowtopdiv.attachevent ("OnMouseUp", function () {
if (moveable)
{
var win = Windowtopdiv.parentnode;
Win.style.borderColor = Topdivbgcolor;
WindowTopDiv.style.backgroundColor = Topdivbgcolor;
Windowtopdiv.releasecapture ();
moveable = false;
}
});
Start dragging
Windowtopdiv.attachevent ("OnMouseMove", function () {
if (moveable)
{
var win = Windowtopdiv.parentnode;
Win.style.left = x1 + event.clientx-x0;
Win.style.top = y1 + event.clienty-y0;
}
});
Double-click the pop-up window
Windowtopdiv.attachevent ("OnDblClick", function () {
Maxorminpopupdiv (WINDOWTOPOPERATESPAN,WINDOWCONTENTDIV);
});
Increase the display of a pop-up window caption
var Windowtoptitlespan = document.createelement ("span");
Windowtoptitlespan.setattribute (' id ', ' windowtoptitle ' +this.id);
WindowTopTitleSpan.style.width = this.width-2*12-4;
WindowTopTitleSpan.style.paddingLeft = "3px";
windowtoptitlespan.innerhtml = This.title;
Add a pop-up window to minimize and maximize the operation
var Windowtopoperatespan = document.createelement ("span");
Windowtopoperatespan.setattribute (' id ', ' windowtopoperate ' +this.id);
WindowTopOperateSpan.style.width = 12;
WindowTopOperateSpan.style.borderWidth = "0px";
WindowTopOperateSpan.style.color = titlefontcolor;//"White";
windowTopOperateSpan.style.fontFamily = "Webdings";
WindowTopOperateSpan.style.cursor = "Default";
windowtopoperatespan.innerhtml = "0";
Maximize or Minimize pop-up operation
Windowtopoperatespan.attachevent ("onclick", function () {
Maxorminpopupdiv (WINDOWTOPOPERATESPAN,WINDOWCONTENTDIV);
});
Add a pop-up window to close the operation
var Windowtopclosespan = document.createelement ("span");
Windowtopclosespan.setattribute (' id ', ' windowtopclose ' +this.id);
WindowTopCloseSpan.style.width = 12;
WindowTopCloseSpan.style.borderWidth = "0px";
WindowTopCloseSpan.style.color = titlefontcolor;//"White";
windowTopCloseSpan.style.fontFamily = "Webdings";
WindowTopCloseSpan.style.cursor = "Default";
windowtopclosespan.innerhtml = "R";
Close window
Windowtopclosespan.attachevent ("onclick", function () {
Windowtopdiv.removechild (Windowtoptitlespan);
Windowtopdiv.removechild (Windowtopoperatespan);
Windowtopdiv.removechild (Windowtopclosespan);
Windowtopbgdiv.removechild (WINDOWTOPDIV);
Windowtopbgdiv.removechild (WINDOWCONTENTDIV);
Document.body.removeChild (WINDOWTOPBGDIV);
Document.body.removeChild (Bgobj);
});
Content
var windowcontentdiv = document.createelement ("div");
Windowcontentdiv.setattribute (' id ', ' windowcontent ' +this.id);
WindowContentDiv.style.background = Contentbgcolor;
WindowContentDiv.style.color = Contentfontcolor;
WindowContentDiv.style.cursor = "Default";
WindowContentDiv.style.height = (this.height-20-4);
WindowContentDiv.style.width = "100%";
WindowContentDiv.style.position = "relative";
WindowContentDiv.style.left = 0;
WindowContentDiv.style.top = 24;
WindowContentDiv.style.lineHeight = "20px";
WindowContentDiv.style.fontSize = "10pt";
WindowContentDiv.style.wordBreak = "Break-all";
windowContentDiv.style.padding = "3px";
windowcontentdiv.innerhtml = This.message;
Writing content to a file
Windowtopdiv.appendchild (Windowtoptitlespan);
Windowtopdiv.appendchild (Windowtopoperatespan);
Windowtopdiv.appendchild (Windowtopclosespan);
Windowtopbgdiv.appendchild (WINDOWTOPDIV);
Windowtopbgdiv.appendchild (WINDOWCONTENTDIV);
Document.body.appendChild (WINDOWTOPBGDIV);
}
}
Maximize or minimize the window of the probe
function Maxorminpopupdiv (WINDOWTOPOPERATESPAN,WINDOWCONTENTDIV)
{
var win = WindowTopOperateSpan.parentNode.parentNode;
var tit = Windowtopoperatespan.parentnode;
var flg = windowcontentdiv.style.display== "None";
if (FLG)
{
Win.style.height = parseint (windowContentDiv.style.height) + parseint (tit.style.height) + 2*2;
WindowContentDiv.style.display = "block";
windowtopoperatespan.innerhtml = "0";
}
Else
{
Win.style.height = parseint (tit.style.height) + 2*2;
windowtopoperatespan.innerhtml = "2";
WindowContentDiv.style.display = "None";
}
}
To darken the background
function Showbackground (obj,endint)
{
if (Isie)
{
Obj.filters.alpha.opacity+=1;
if (obj.filters.alpha.opacity<endint)
{
settimeout (function () {this.showbackground (obj,endint)},5);
}
}
Else
{
var al=parsefloat (obj.style.opacity); al+=0.01;
Obj.style.opacity=al;
if (al< (endint/100))
{
settimeout (function () {this.showbackground (obj,endint)},5);
}
}
}
Close pop-up window
function Closedivwindow (ID)
{
var Windowtoptitlespan = document.getElementById ("Windowtoptitle" +id);
var Windowtopoperatespan = document.getElementById ("windowtopoperate" +id);
var Windowtopclosespan = document.getElementById ("Windowtopclose" +id);
var windowtopdiv = document.getElementById ("Windowtop" +id);
var windowtopbgdiv = document.getElementById ("WINDOWTOPBG" +id);
var windowcontentdiv = document.getElementById ("windowcontent" +id);
var bgobj = document.getElementById ("window" +id);
Windowtopdiv.removechild (Windowtoptitlespan);
Windowtopdiv.removechild (Windowtopoperatespan);
Windowtopdiv.removechild (Windowtopclosespan);
Windowtopbgdiv.removechild (WINDOWTOPDIV);
Windowtopbgdiv.removechild (WINDOWCONTENTDIV);
Document.body.removeChild (WINDOWTOPBGDIV);
Document.body.removeChild (Bgobj);
}
