Lösung für den Fehler, dass IE6 select nicht durch div abgedeckt werden kann
|
Verwenden Sie div, um eine Maske zu erstellen oder ein Popup-Fenster zu simulieren. Wenn sich in IE6 jedoch ein Dropdown-Listenfeld-Auswahlelement unter dem div befindet, durchbricht das Dropdown-Listenfeld das div und wird auf dem div angezeigt. Dieses Problem tritt unabhängig vom Z-Indexwert auf. Das Problem kann an der Popup-Dropdown-Liste des Dropdown-Listensteuerelements liegen, wodurch die Höhe der Z-Achse außer Kontrolle gerät. Aber IE6 besitzt eine magische Logik: Div kann „Select“ nicht abdecken, Iframe jedoch schon und Div kann „Iframe“ abdecken. Die Lösung besteht also darin, ein Iframe-Element mit einer höheren Z-Achsenhöhe zu verwenden, um das Dropdown-Listenfeld-Steuerelement zu umschließen oder abzudecken und es so auf seine normale Z-Achsenhöhe zurückzusetzen! Der HTML-Code lautet wie folgt: HTML Quelltext Code kopieren Der Code lautet wie folgt:<div id="acontainnerbox" class="aboxinitcss"> Hier sind viele Codes, <iframe Klasse="ifhideselect" frameborder="0"></iframe> </div> Code kopieren Der Code lautet wie folgt:<div id="acontainnerbox" class="aboxinitcss"> Hier sind viele Codes, <iframe Klasse="ifhideselect" frameborder="0"></iframe> </div> Der CSS-Code lautet wie folgt: HTML Quelltext Code kopieren Der Code lautet wie folgt:.aboxinitcss{ Position: absolut; Rand oben: 0px; Rand links: 0px; Anzeige: keine; Hintergrund:#FFF; Rand: durchgezogen #CCC 1px; Polsterung: 30px; z-Index:9999; Breite: 620px; Überlauf: versteckt; } .ifhideselect{ z-Index: -1; Breite: 680px; Höhe: 255px; Position: absolut; Rand: 0; links: 0; oben: 0; } .aboxinitcss{ Position: absolut; Rand oben: 0px; Rand links: 0px; Anzeige: keine; Hintergrund:#FFF; Rand: durchgezogen #CCC 1px; Polsterung: 30px; z-Index:9999; Breite: 620px; Überlauf: versteckt; } .ifhideselect{ z-Index: -1; Breite: 680px; Höhe: 255px; Position: absolut; Rand: 0; links: 0; oben: 0; } Dadurch wird dieser Fehler behoben. Der Z-Index des Iframes muss auf eine negative Zahl gesetzt werden, sonst wird er nicht abgedeckt. |
<<: Spezifische Verwendung des Stapelkontexts in CSS
>>: Ein Artikel, der Ihnen ein tiefes Verständnis von Mysql-Triggern vermittelt
Artikel empfehlen
Fähigkeiten zur Erstellung von Webformularen
Tatsächlich haben die drei obigen Tabellen alle d...
Implementierung der Miniprogramm-Aufzeichnungsfunktion
Vorwort Bei der Entwicklung eines Miniprogramms b...
Tutorial zum Ändern von Inline-Stilen von element.style
Vorwort Als wir den Stil der Webseite oben geschr...
So verwenden Sie MQTT im Uniapp-Projekt
Inhaltsverzeichnis 1. Referenz-Plugins im Uniapp ...
MySQL Dual-Machine Hot-Standby-Implementierungslösung [testbar]
Inhaltsverzeichnis 1. Konzept 2. Umgebungsbeschre...
So verwenden Sie CSS-Overflow: Hidden (Überlauf ausblenden und Floats löschen)
Überlauf ausblenden Damit ist gemeint, dass Text-...
Importieren von CSS-Dateien unter Verwendung von Beurteilungsbedingungen
Lösung 1: Verwenden Sie bedingten Import im HTML-...
Der praktische Prozess des Login-Status-Managements im vuex-Projekt
Inhaltsverzeichnis Werkzeug: Anmeldeszenario: übe...
Lösen Sie das Problem der blockierenden Positionierungs-DDL in MySQL 5.7
Im vorherigen Artikel „Änderungen der MySQL-Tabel...
Beim Zugriff auf die Homepage eines im Docker-Modus gestarteten Tomcat tritt ein 404-Fehler auf
Szenario: Beim Starten von Tomcat in Docker (Vers...
Erste Schritte mit MySQL - Konzepte
1. Was ist das? MySQL ist das beliebteste relatio...
Beispiel zum Erstellen eines Datenbanknamens mit Sonderzeichen in MySQL
Vorwort In diesem Artikel wird erklärt, wie Sie i...
Detaillierte Erklärung zur Identifizierung von Dateien mit gleichem Inhalt unter Linux
Vorwort Manchmal stellen Dateikopien eine enorme ...
Detaillierte Erklärung des strikten Modus in JavaScript
Inhaltsverzeichnis Einführung Verwenden des strik...