Heim > Web-Frontend > CSS-Tutorial > Seitenmaskenebene und verhindern, dass der Seitenkörper scrollt. Bootstrap-Modalbox-Prinzip_CSS/HTML

Seitenmaskenebene und verhindern, dass der Seitenkörper scrollt. Bootstrap-Modalbox-Prinzip_CSS/HTML

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Freigeben: 2016-05-16 12:03:36
Original
3210 Leute haben es durchsucht

Umsetzungsideen:

1. Es muss eine Schicht vorhanden sein, die den Körper bedeckt und über dem Körper platziert wird.

2. Ändern Sie den Überlaufattributwert von body in: versteckt

Kein Unsinn mehr, der Schlüsselcode ist veröffentlicht, kompatibel mit Firefox, Google und IE

Der Stilcode der Maskenebene, der rote Teil ist der Schlüsselteil

Code kopieren Der Code lautet wie folgt:

.cover {
position:fixed; oben: 0px; unten: 0px;filter: alpha(opacity=60);
z-index: 1002; ; display:none;
opacity:0.5; -moz-opacity:0.5;
}

Code für Webseitenteil

Code kopieren Der Code lautet wie folgt:

JS-Teil des Codes

Code kopieren Der Code lautet wie folgt:

Funktion showMask(){
$ ('body ').css("overflow","hidden")
$("#cover").show();
}
Verwandte Etiketten:
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage