コードコピーは次のとおりです。
<！doctype html public " - // w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html>
<head>
<Title>新しいドキュメント</title>
<メタcharset = "utf-8">
<Meta http-equiv = "content-type" content = "text/html; charset = utf-8"/>
<Meta name = "Author" content = "">
<Meta name = "keywords" content = "">
<メタ名= "説明" content = "">
<style type = "text/css">
*
{
パディング：0px;
マージン：0px;
}
#idiv
{
幅：900px;
高さ：自動;
位置：絶対;
z-index：1000;
ボーダー：2pxソリッド#ffffff;
背景：#ffffff;
}
</style>
</head>
<body>
<div id = "idiv" style = "display：none;">
<a href = "javascript：void（0）" onclick = "closediv（）">クリックしてレイヤーを閉じます</a>
<br/> document.documentelement <br/> document.documentlementの違い
</div>
<div> <a href = "javascript：void（0）" id = "show" onclick = "show（）">クリックしてポップアップレイヤーを開きます！ </div>
</body>
<スクリプトlangue = "javascript">
関数show（）
{
var idiv = document.getElementById（ "IDIV"）;
idiv.style.display = "block";
//ポップアップレイヤーを表示するために、次の部分を中央に配置する必要があります
idiv.style.left =（document.documentelement.clientwidth-idiv.clientwidth）/2+document.documentelement.scrollleft+ "px";
//alert(document.body.scrolltop）
var aa_scrolltop = document.documentelement.scrolltop || window.pageyoffset || document.body.scrolltop;
idiv.style.top =（document.documentelement.clientheight-idiv.clientheight）/2+aa_scrolltop+"px";
//ここには問題があります。ポップアップ層は左右に中央にありますが、高さは中心にあり、上部に表示され、1つの//パーツが見えなくなります。したがって、一時的にマージントップを下に追加します。
//次のパーツにより、ページ全体がグレーアウトクリック可能になります
var procbg = document.createelement（ "div"）; //最初にdivを作成します
procbg.setattribute（ "id"、 "mybg"）; // divのIDを定義します
procbg.style.background = "＃000000";
procbg.style.width = "100％";
procbg.style.height = "100％";
procbg.style.position = "sixt";
procbg.style.top = "0";
procbg.style.left = "0";
procbg.style.zindex = "500";
procbg.style.opacity = "0.6";
procbg.style.filter = "alpha（ofacity = 70）";
// Scrollbarをキャンセルします
document.body.AppendChild（procbg）;
document.body.style.overflow = "auto";
//次の部分は、ポップアップレイヤーのドラッグ効果を実現します（ポップアップレイヤーでDIVを移動する場合は、ログアウトして次のことを削除します）
/*
var posx;
var posy;
idiv.onmousedown = function（e）
{
if（！e）e = window.event; // IE
posx = e.clientx -parseint（idiv.style.left）;
posy = e.clienty -parseint（idiv.style.top）;
document.onmousemove = mousemove;
}
document.onmouseup = function（）
{
document.onmousemove = null;
}
機能Mousemove（EV）
{
if（ev == null）ev = window.event; // ie
idiv.style.left =（ev.clientx -posx） +"px";
idiv.style.top =（ev.clienty -posy） +"px";
}*/
}
function closediv（）//ポップアップレイヤーを閉じます
{
var idiv = document.getElementById（ "IDIV"）;
var mybg = document.getElementById（ "mybg"）;
document.body.removechild（mybg）;
idiv.style.display = "none";
document.body.style.overflow = "auto"; //ページscrollbarを復元します
//document.getElementById("mybg").style.display="none ";
}
</script>
</html>
//上記のポップアップレイヤーを変更し、独自のロード機能を作成します。ページが読み込まれているかどうかを判断し、完了後にloading.gifを非表示にします
<！doctype html>
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<Title>新しいドキュメント</title>
<Meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
</head>
<body onload = "subsomething（）">
</body>
<script type = "text/ecmascript">
function show（adsterimg、img_w、img_h）{
//ページの高さを取得します
var h =（document.documentelement.clientheight> document.documentelement.clientheight）？ document.documentelement.scrollheight：document.documentelement.clientheight;
//ページ幅を取得します
var w =（document.documentelement.scrollwidth> document.documentelement.clientWidth）？ document.documentelement.scrollwidth：document.documentelement.scrollwidth;
var procbg = document.createelement（ "div"）; //最初にdivを作成します
procbg.setattribute（ "id"、 "mybg"）; // divのIDを定義します
procbg.style.background = "＃555";
procbg.style.width = "100％";
procbg.style.height = "100％";
procbg.style.position = "sixt";
procbg.style.top = "0";
procbg.style.left = "0";
procbg.style.zindex = "500";
procbg.style.opacity = "0.6";
procbg.style.filter = "alpha（ofacity = 70）";
// Scrollbarをキャンセルします
document.body.AppendChild（procbg）;
document.body.style.overflow = "auto";
var pimg = document.createelement（ "img"）; // IMGを作成します
pimg.setattribute（ "id"、 "bg_img"）; // divのIDを定義します
pimg.setattribute（ "src"、adstermg）; // divのIDを定義します
var img_w =（w -img_w） / 2;
var img_h =（h -img_h） / 2;
pimg.style.top = img_h + "px";
pimg.style.left = img_w + "px";
pimg.style.position = "sixt";
pimg.style.opacity = "0.9";
document.getElementById（ "mybg"）。appendchild（pimg）;
}
function closediv（）//ポップアップレイヤーを閉じます
{
var mybg = document.getElementById（ "mybg"）;
document.body.removechild（mybg）;
document.body.style.overflow = "auto"; //ページscrollbarを復元します
//document.getElementById("mybg").style.display="none ";
}
show（ 'loading/loading3.gif'、 '100'、 '100'）;
document.oneadedStateChange = subsomething; //ページの読み込み状態が変更されたときにこのメソッドを実行します。
function subsomething（）{
if（document.readystate == "complete"）{//ページの読み込み状態が完全に終了したときに入力します
closediv（）;
}
}
</script>
</html>