Das Problem, auf das ich heute gestoßen bin, ist, dass die Maskenschicht hinter der Popup-Ebene eine Bildlaufleiste hat, sodass im unsichtbaren Bereich unter der Bildlaufleiste keine Maskenschicht vorhanden ist. Die Lösung besteht darin, CSS hinzuzufügen.
JS -Code
<script type = "text/javaScript"> // graue JS -Mask -Schicht -Funktion Showbg (CT, Inhalt) {var bh = $ (document) .Height (); var bw = $ ("Körper"). width ()+16; var objwh = getObjwh (ct); $ ("#fullbg"). CSS ({Breite: BW, Höhe: BH, Anzeige: "Block"}); var tbt = objwh.split ("|") [0]+"px"; var tbl = objwh.split ("|") [1]+"px"; $ ("#Dialog"). show (); $ ("#"+ct) .css ({top: tbt, links: tbl, Anzeige: "Block"}); $ (Fenster) .Scroll (function () {resetbg ()}); $ (Fenster) .Resize (function () {resetbg ()}); } Funktion getObjwh (obj) {var st = document.documentElement.scrolltop; // Entfernung des Scroll -Balkens zum oberen var sl = document.documentElement.scrollleft; // Abstand des Scroll -Balkens zum linken Var ch = document. var objh = $ ("#"+obj) .height (); // Die Höhe des schwimmenden Objekts var objw = $ ("#"+obj) .width (); // die Breite des schwimmenden Objekts var objt = nummer (st)+(ch.) -Number (objh))/2; var objl = number (sl)+(number (cw) -Number (objw))/2; return objt+"|"+objl; } function resetbg () {var fullbg = $ ("#fullbg"). CSS ("display"); if (fullbg == "block") {var bh2 = $ ("body"). height (); var bw2 = $ ("Körper"). width ()+16; $ ("#fullbg"). CSS ({Breite: BW2, Höhe: BH2}); var objv = getObjwh ("Dialog"); var tbt = objv.Split ("|") [0]+"px"; var tbl = objv.Split ("|") [1]+"px"; $ ("#Dialog"). CSS ({TOP: TBT, links: TBL}); }} // Schließen Sie die graue JS -Maskenschicht- und Betriebsfensterfunktion in CloseBg () {$ ("#fullbg"). CSS ("Anzeige", "None"); $ ("#Dialog"). CSS ("Anzeige", "None");} </script>CSS -Code
#fullbg {Hintergrundfarbe: Gray; Anzeige: Keine; Z-Index: 3; links: 0px; Deckkraft: 0,5; Top: 0; links: 0; Höhe: 100%; Breite: 100%; Z-Index: 999; Position: fest; _position: absolut; _left: expression_r (documentElement.scrollleft + documentElement.clientwidth - this.offsetwidth); _top: expression_r (documentElement.scrolltop + documentElement.clientHeight - this.offseteight); filter: alpha (opacity = 30); Deckkraft: 0,3; } #dialog {width: 560px; Hintergrund: #eee; Anzeige: Keine; Z-Index: 5; Polsterung: 16px; Schriftgröße: 12px; Z-Index: 1000; Position: absolut;}#Dialog Sup {color:#f00;}#Dialog .CLOSE0 {Position: Relativ; Oben: -24px; links: 544px; Höhe: 38px; Breite: 40px;}HTML -Code
<div id = "fullbg"> </div> <!-End JS Mask Layer-> <!-Dialog-> <div id = "Dialog"> <div> <a href = "#" onclick = "closeBg (); Informationen </h3> <p> (Hinweis: Die folgenden Informationen werden nur zum Senden von relevanten Servicematerialien nach Bedarf verwendet. Sie werden keine Informationen verletzen. Bitte verstehen Sie. bgcolor = "#fbfbfb"> <b> {$ member.member_name} </b> </td> <td bgcolor = "#eeeeee"> <sup>*</sup> echter Name </td> <td bgcolor = "#fbfbbbb"> <b> {{{{$ bgcolor = "#eeeeeeee"> Geschlecht </td> <td bgcolor = "#fbfbfb"> <b> <php> echo $ Gender [$ info ['Gender']; <td bgcolor="#fbfbfb"><b>{$info.TELEPHONE}</b></td> <td bgcolor="#eeeeee">Email</td> <td colspan="3" bgcolor="#fbfbfb"><b>{$member.EMAIL}</b></td> </tr> <tr> <td colspan = "2" bgcolor = "#eeeeeeee"> <sup>*</sup> Gültige ID (ID -Karte) </td> <td colspan = "4" bgcolor = "#fbbfb" bgcolor="#eeeeee">Mailing address</td> <td colspan="3" bgcolor="#fbfbfb"><b>{$info.ADDRESS}</b></td> <td bgcolor="#eeeeee">Zip code</td> <td bgcolor = "#fbfbfb"> <b> {$ info.zip} </b> </td> </tr> </table> </div> </div>Beruhigen Sie sich und fahren Sie Schritt für Schritt fort.
Der obige Artikel ist ein Klischee über das Problem der Maskenschicht -Scroll -Leiste. Dies ist der gesamte Inhalt, den ich mit Ihnen teile. Ich hoffe, Sie können Ihnen eine Referenz geben und ich hoffe, Sie können wulin.com mehr unterstützen.