Warum erscheint mein Kontextmenü in IE7 hinter der Schaltfläche?

IE7 Z-Index-Problem für Kontextmenü

Problemstellung:

In IE7, Unter der Schaltfläche, mit der es verknüpft ist, wird ein Kontextmenü (UL) angezeigt, das das Menü verbirgt. Dieses Verhalten unterscheidet sich von anderen Browsern aufgrund der einzigartigen Handhabung von Stapelkontexten durch den Browser.

Analyse:

Das für die Schaltfläche und das Menü verwendete CSS positioniert diese Elemente mithilfe relativer und absolute Positionierung bzw. In IE7 bestimmt jedoch der am nächsten positionierte Vorfahre (in diesem Fall das „control-action“-Div) den Stapelkontext. Dies bedeutet, dass der Z-Index des Menüs (10000) nicht berücksichtigt wird und das Menü unterhalb der Schaltfläche positioniert wird.

Lösung:

Um dieses Problem zu beheben , kann die Reihenfolge der HTML-Elemente wie folgt geändert werden:

<div class="control-action">
  <ul>

Durch Platzieren der Schaltfläche nach dem ul wird die Schaltfläche zum nächstgelegenen positionierten Vorfahren und erstellt so einen neuen Stapelkontext. Folglich wird der Z-Index des Menüs (10000) wirksam und das Menü erscheint nun über der Schaltfläche.

Das obige ist der detaillierte Inhalt vonWarum erscheint mein Kontextmenü in IE7 hinter der Schaltfläche?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!