Html lock page (javascript mask layer pops up div effect) _ javascript skills

Html lock page (js mask layer pops up div effect). For more information, see. The Code is as follows:

UntitledDocument
Script
Function createIframe (){
// Mask Layer
Var newMask = document. createElement ("p ");
NewMask. id = "mDiv ";
NewMask. style. position = "absolute ";
NewMask. style. zIndex = "1 ";
_ScrollWidth=Math.max(document.body.scrollWidth,document.doc umentElement. scrollWidth );
_ScrollHeight=Math.max(document.body.scrollHeight,document.doc umentElement. scrollHeight );
// _ ScrollHeight = Math.max(document.body.offsetHeight,document.doc umentElement. scrollHeight );
NewMask. style. width = _ scrollWidth + "px ";
NewMask. style. height = _ scrollHeight + "px ";
NewMask. style. top = "0px ";
NewMask. style. left = "0px ";
NewMask. style. background = "# 33393C ";
// NewMask. style. background = "# FFFFFF ";
NewMask. style. filter = "alpha (opacity = 40 )";
NewMask. style. opacity = "0.40 ";
NewMask. style. display = 'none ';
Var objDiv = document. createElement ("DIV ");
ObjDiv. id = "p1 ";
ObjDiv. name = "p1 ";
ObjDiv. style. width = "480px ";
ObjDiv. style. height = "200px ";
ObjDiv. style. left = (_ scrollWidth-480)/2 + "px ";
ObjDiv. style. top = (_ scrollHeight-200)/2 + "px ";
ObjDiv. style. position = "absolute ";
ObjDiv. style. zIndex = "2"; // Add this statement to make objDiv float on newMask
ObjDiv. style. display = "none"; // hide objDiv in advance
ObjDiv. innerHTML ='

';
// Changed the X button to trigger the Close event.
ObjDiv. style. border = "solid # 0033FF 3px ;";
Var frm = document. createElement ("iframe ");
Frm. id = "ifrm ";
Frm. name = "ifrm ";
Frm. style. position = "absolute ";
Frm. style. width = "100% ";
Frm. style. height = 180;
Frm. style. top = 20;
Frm. style. display = '';
Frm. frameborder = 0;
ObjDiv. appendChild (frm );
// NewMask. appendChild (objDiv); // The problem lies here: you change the p of the frame to the child element of newMask. When the transparency of newMask is changed, of course, the frame is affected.
Document. body. appendChild (newMask );
Document. body. appendChild (objDiv );
Var objDrag = document. getElementById ("drag ");
Var drag = false;
Var dragX = 0;
Var dragY = 0;
ObjDrag. attachEvent ("onmousedown", startDrag );
Function startDrag (){
If (event. button = 1 & event. srcElement. tagName. toUpperCase () = "DIV "){
ObjDrag. setCapture ();
ObjDrag. style. background = "# 0000CC ";
Drag = true;
DragX = event. clientX;
DragY = event. clientY;
}
};
ObjDrag. attachEvent ("onmousemove", Drag );
Function Drag (){
If (drag ){
Var oldwin = objDrag. parentNode;
Oldwin. style. left = oldwin. offsetLeft + event. clientX-dragX;
Oldwin. style. top = oldwin. offsetTop + event. clientY-dragY;
Oldwin. style. left = events. clientX-100;
Oldwin. style. top = events. clientY-10;
DragX = event. clientX;
DragY = event. clientY;
}
};
ObjDrag. attachEvent ("onmouseup", stopDrag );
Function stopDrag (){
ObjDrag. style. background = "# 0033FF ";
ObjDrag. releaseCapture ();
Drag = false;
};
}
Function htmlEditor (){
Var frm = document. getElementById ("ifrm ");
Var objDiv = document. getElementById ("p1 ");
Var mDiv = document. getElementById ("mDiv ");
MDiv. style. display = '';
Var iframeTextContent = '';
IframeTextContent + ='';
IframeTextContent + ='';
IframeTextContent + ='';
IframeTextContent + =' ';
IframeTextContent + ='';
IframeTextContent + ='';
IframeTextContent + ='











';IframeTextContent + =' ';IframeTextContent + =' ';IframeTextContent + =' ';IframeTextContent + =' ';IframeTextContent + =' ';IframeTextContent + =' ';IframeTextContent + =' ';IframeTextContent + =' ';IframeTextContent + =' ';IframeTextContent + =' ';IframeTextContent + =' ';IframeTextContent + ='

Name
Email

';
IframeTextContent + ='';
IframeTextContent + ='';
Frm.contentcontactdoc ument. designMode = 'off ';
Frm.content{doc ument. open ();
Frm.contentcontentdoc ument. write (iframeTextContent );
Frm.content{doc ument. close ();
ObjDiv. style. display = ""; // display the floating p
Var objgo1_frm.content1_doc ument. getElementById ("btGo ");
ObjGo. attachEvent ("onclick", function (){
HideIframe (mDiv, objDiv );
});
}

Function HideIframe (mDiv, objDiv ){
MDiv. style. display = 'none ';
ObjDiv. style. display = "none"; // hide the floating p
}
Script

Aa
Bb

[Br]