Die Codekopie lautet wie folgt:
<! DocType html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transsitional.dtd">
<html>
<kopf>
<title> Neues Dokument </title>
<meta charset = "utf-8">
<meta http-äquiv = "content-type" content = "text/html; charset = utf-8"/>
<Meta name = "Autor" content = "">
<Meta name = "keywords" content = "">
<Meta name = "Beschreibung" content = "">
<style type = "text/css">
*
{
Polsterung: 0px;
Rand: 0px;
}
#Idiv
{
Breite: 900px;
Höhe: Auto;
Position: absolut;
Z-Index: 1000;
Grenze: 2PX Solid #ffffff;
Hintergrund: #ffffff;
}
</style>
</Head>
<body>
<div id = "idiv" style = "display: keine;">
<a href = "JavaScript: void (0)" onclick = "closeiv ()"> Klicken Sie Klicken, um die Ebene zu schließen </a>
<br/> Unterschiede in document.documentElement <br/> Unterschiede in Dokument.DocumentElement
</div>
<div> <a href = "JavaScript: void (0)" id = "show" onclick = "show ()"> Klicken Sie Klicken, um die Popup-Ebene zu öffnen! </div>
</body>
<Script Langue = "JavaScript">
Funktionshow ()
{
var idiv = document.getElementById ("idiv");
Idiv.style.display = "block";
// Die folgenden Teile sollten zentriert sein, um die Popup-Ebene anzuzeigen
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";
// Es gibt hier ein Problem. Die Popup-Schicht ist links und rechts zentriert, aber die Höhe ist nicht zentriert und wird im oberen Teil angezeigt, wodurch ein Teil unsichtbar ist. Fügen Sie also vorübergehend den Rand unten hinzu.
// Die folgenden Teile machen die gesamte Seite grau-out-klickbar
var procbg = document.createelement ("div"); // Erstellen Sie zuerst ein Div
procbg.setattribute ("id", "mybg"); // Definieren Sie die ID der Div
procbg.style.background = "#000000";
procbg.style.width = "100%";
Procbg.Style.Height = "100%";
procbg.style.position = "fixed";
procbg.style.top = "0";
procbg.style.left = "0";
procbg.style.zindex = "500";
procbg.style.opacity = "0,6";
procbg.style.filter = "alpha (opacity = 70)";
// Scrollbar abbrechen
document.body.appendchild (procbg);
document.body.Style.overflow = "auto";
// Die folgenden Teile erkennen den Drag-Effekt der Popup-Ebene (wenn Sie die DIV in der Popup-Ebene verschieben möchten, melden Sie sich einfach ab und entfernen Sie Folgendes).
/*
var posx;
var posy;
Idiv.onmousedown = function (e)
{
if (! e) e = window.event; // dh
posx = e.clientX - parseInt (idiv.style.left);
posy = e.clienty - parseInt (idiv.style.top);
document.onmousemove = mousemove;
}
document.onmouseUp = function ()
{
document.onmousemove = null;
}
Funktion Mousemove (EV)
{
if (ev == null) ev = window.event; // dh
Idiv.style.left = (ev.clientx - posx) +"px";
Idiv.style.top = (ev.clienty - posy) +"px";
}*/
}
Funktion closeiV () // Schließen Sie die Popup-Ebene
{
var idiv = document.getElementById ("idiv");
var mybg = document.getElementById ("mybg");
document.body.removechild (mybg);
Idiv.style.display = "Keine";
document.body.style.overflow = "auto"; // Seite seite scrollbar wiederherstellen
//document.getElementById("Mybg").Style.display="none ";
}
</script>
</Html>
// Ändern Sie die oben genannte Popup-Ebene und erstellen Sie Ihre eigene Ladefunktion. Stellen Sie fest, ob die Seite geladen wurde, und ausblenden Sie das Laden.gif nach Abschluss
<! DocType html>
<html xmlns = "http://www.w3.org/1999/xhtml">
<kopf>
<title> Neues Dokument </title>
<meta http-äquiv = "content-type" content = "text /html; charset = utf-8" />
</head>
<body onload = "suboming ()">
</body>
<script type = "text/ecmascript">
Funktionshow (addresimg, img_w, img_h) {
// Seitenhöhe erhalten
var h = (document.documentElement.clientHeight> document.documentElement.clientHeight)? document.documentElement.scrollHeight: document.documentElement.clientHeight;
// Seitenbreite abrufen
var w = (document.documentElement.scrollwidth> document.documentElement.clientwidth)? document.documentElement.scrollwidth: document.documentElement.scrollwidth;
var procbg = document.createelement ("div"); // Erstellen Sie zuerst ein Div
procbg.setattribute ("id", "mybg"); // Definieren Sie die ID der Div
procbg.style.background = "#555";
procbg.style.width = "100%";
Procbg.Style.Height = "100%";
procbg.style.position = "fixed";
procbg.style.top = "0";
procbg.style.left = "0";
procbg.style.zindex = "500";
procbg.style.opacity = "0,6";
procbg.style.filter = "alpha (opacity = 70)";
// Scrollbar abbrechen
document.body.appendchild (procbg);
document.body.Style.overflow = "auto";
var pimg = document.createelement ("img"); // Erstellen Sie eine IMG
pimg.setattribute ("id", "bg_img"); // Definieren Sie die ID der Div
pimg.setattribute ("src", adressImg); // Definieren Sie die ID der Div
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 = "fixed";
pimg.style.opacity = "0,9";
document.getElementById ("mybg"). appendChild (pimg);
}
Funktion closeiV () // Schließen Sie die Popup-Ebene
{
var mybg = document.getElementById ("mybg");
document.body.removechild (mybg);
document.body.style.overflow = "auto"; // Seite seite scrollbar wiederherstellen
//document.getElementById("Mybg").Style.display="none ";
}
show ('laden/laden3.gif', '100', '100');
document.onReadyStatechange = Suboming; // Führen Sie diese Methode aus, wenn sich die Seite des Ladezustands ändert.
Funktion subominging () {
if (document.readyState == "complete") {// Geben Sie ein, wenn die Ladezustand der Seite vollständig beendet ist
closeiv ();
}
}
</script>
</html>