JavaScript masking layer and Popup layer

*element.style.width (height) can only get the width and height of the HTML (cannot get the style in CSS), and the width and height of the string with ' px '

*element.offsetheight (offsetwidth) needs to be inserted into the HTML (the newly created element) to obtain the

Mask layer and pop-up layer (login box) using fixed positioning, mask layer using the device resolution of the wide height

function Opennew () {
Get the height and width of the device resolution
var swidth=window.screen.width;
var sheight=window.screen.height;
Get the visual area height and width of a page
var wheight=document.documentelement.clientheight;
var wwidth=document.documentelement.clientwidth;
var omask=document.createelement ("div");
Omask.id= "Mask";
omask.style.height=sheight+ "px";
omask.style.width=swidth+ "px";
Document.body.appendChild (Omask);
var ologin=document.createelement ("div");
ologin.id= "Login";
Ologin.innerhtml= "<div class= ' Logincon ' ><div id= ' close ' > click Close </div></div>";
Document.body.appendChild (Ologin);
Get the width and height of the login box
var dheight=ologin.offsetheight;
var dwidth=ologin.offsetwidth;
Set the left and top of the login box
ologin.style.left=swidth/2-dwidth/2+ "px";
ologin.style.top=sheight/2-dheight/2+ "px";
Click the Close button
var Oclose=document.getelementbyid ("Close");
Click outside the login box to also close the login box
Oclose.onclick=omask.onclick=function () {
Document.body.removeChild (Ologin);
Document.body.removeChild (Omask);
};
};
Window.onload=function () {
var Obtn=document.getelementbyid ("Btnlogin");
Click the login button
Obtn.onclick=function () {
Opennew ();
return false;
}
}

JavaScript masking layer and Popup layer