IE7, :hover und quirks mode

[ralf]

Hallo!

Ich soll in eine Seite, auf deren DOCTYPE ich keinen Einfluss nehmen kann, ein mehrstufiges CSS-Menü einbauen.

Dabei bin ich auf eine Lösung von Stu Nichols getroffen: http://www.cssplay.co.uk/menus/basic_dd.html

Diese funktioniert aber leider nicht im IE7 im quirks mode, weil der IE7 dann wie sein Vorgänger :hover nur für Links versteht.

Durch Veränderung der conditional comments habe ich versucht, dass der IE7 die gleiche Struktur (also die Tabelle innerhalb des Links) erhält. Das führt zwar dazu, dass die nächste Linkebene beim :hover des übergeordneten Links angezeigt wird, aber diese Links sind nicht zugänglich, weil sie unmittelbar wieder ausgeblendet werden, wenn der übergeordnete Link verlassen wird.

Gibt es eine Möglichkeit, mit dem IE7 solche Menüs auch im quirks mode zu definieren - ohne Javascript? Javascript wäre kein Hinderungsgrund in diesem Fall, weil das Menü ohnehin per Javascript generiert wird, aber eine CSS-Lösung würde ich vorziehen.

Ich habe auch schon behaviours mit csshover.htc in Erwägung gezogen, aber das müsste auch erst umgearbeitet werden, weil das Menü erst beim Laden der Seite erzeugt wird.

Mir ist jede einfache Lösung Recht, die im IE7 funktioniert. Validität etc. spielt in diesem Fall keine Rolle.

Ralf

[Joachim]

Hi,

Mir ist jede einfache Lösung Recht, die im IE7 funktioniert. Validität etc. spielt in diesem Fall keine Rolle.

Javascript soll es nicht sein, aber den halbwegs berechenbaren Standard Mode sowie Validität verzichtest Du? Und obwohl das Menu sowieso mit Javascript generiert wird schreibst Du lieber Tables in Links, um den Hover zu nutzen?

Ich habe das Gefühl, Du solltest mal Deine Parameter überdenken. Und nebenbei:
csshover.htc nutzt auch javascript.

Gruesse, Joachim

[ralf]

Hallo,

vielen Dank für deine hilfereiche Antwort :(

Javascript soll es nicht sein, aber den halbwegs berechenbaren Standard Mode sowie Validität verzichtest Du?

Darauf verzichte ich nur ungern. Aber wie schon geschrieben habe ich darauf keinen Einfluss und muss daher auf andere Möglichkeiten ausweichen.

Und obwohl das Menu sowieso mit Javascript generiert wird schreibst Du lieber Tables in Links, um den Hover zu nutzen?

Es liegt ein archaisches Menü mit einer Aufreihung von Links vor, aus welchem ich per Javascript ein modernes strukturiertes machen möchte. Selbstverständlich kommt dieses ohne Tabellen aus, wenn ein Standardbrowser in Aktion ist. Aber für den IE6 gibt es meines Wissens keine andere Möglichkeit. Und du kennst anscheinend auch keine.

Ich habe das Gefühl, Du solltest mal Deine Parameter überdenken. Und nebenbei:
csshover.htc nutzt auch javascript.

Ich habe das Gefühl, dass du an deiner Lesefähigkeit arbeiten solltest. Ich habe die Voraussetzungen genannt und auch Lösungnsmöglichkeiten, die mir jedoch aus verschiedenen Gründen nicht gefallen. Wie die csshover.htc funktioniert, ist mir bewusst, sonst hätte ich nicht erwähnt, dass ich sie anpassen müsste.

Ich habe nach einer Möglichkeit gefragt, die ich vielleicht bisher übersehen habe. Falls jemand konstruktive Vorschläge hat, die im genannten Umfeld möglich sind, freue ich mich.

Gruß, Ralf

[Ralf]

Da ich befürchte, dass es keine Lösung per CSS gibt (vermutlich nicht geben kann) und ohnehin Javascript vorausgesetzt werden kann, habe ich mich für folgendes kleine Script entschieden, welches dem Elternelement der jeweiligen Liste die Mouse-Handler zum Ein- und Ausblenden zuweist (steht im Quelltext nach dem Menü bzw. wird onload o.ä. aufgerufen):

(function(){  
  var allUL = document.getElementsByTagName("UL");  
  for (var ux=0; ux<allUL.length; ux++) {  
    var cUL = allUL[ux];  
    var pUL = cUL.parentNode;  
    pUL.ul = cUL;  
    pUL.onmouseover = function () {this.ul.style.visibility = "visible";};  
    pUL.onmouseout = function () {this.ul.style.visibility = "";};  
  };  
}());