CSS Menü und IE6 - das bringt mich noch um ;-)

[afragner]

Hi,

ich sitz hier schon ein paar Nächte an einem Problem und bin schon fast am aufgeben - es geht um folgende seite:
www.seelenraum.org - Dr. Natascha Wendt: Home

Bitte unbedingt das index.php miteingeben sonst kommt Ihr nur auf die "Coming Soon" Version ohne Menü

Also die Sache validiert CSS mässig und HTML mässig komplett mit W3C - mein Problem ist aber: im IE7 und FireFox wird alles richtig dargestellt, im IE6 gibts aber kein Dropdown, und auch die Positionierung des Menüs selbst stimmt nicht - wobei die Positionierung stört mich nicht unbedingt, aber runterklappen sollte das Teil dann schon...

Wäre nett wenn Ihr Euch das mal ansehen könntet, ich bin scheinbar schon betriebsblind und überseh wahrscheinlich schon einiges.

Vielen Dank schon mal für Eure Hilfe! ;Jump

Andreas.

 

[neuroleptika]

im IE6 gibts aber kein Dropdown

Ich hab es mir jetzt nur kurz angesehen.
Aber ein Problem wird sein, daß der IE erst ab Vers. 7 :hover in anderen Elementen als <a> versteht.

#cssmenu li:hover ul ul, #cssmenu li:hover ul ul ul,

-Entweder mußt du das a-Element direkt mit :hover ansprechen,

-oder dem IE6 mit Javascript nachhelfen.

Wenn du die ganze css selber geschrieben hast, wirst du die erste Variante vielleicht selber umsetzen können.
Ansonsten noch mal nachfragen.

 

[shade]

Mal ne ganz andere Frage, wie erstellt man den so ein Menü!?

 

[afragner]

so ganz blick ich noch nicht durch...

also um die Frage nach der Erstellung zu beantworten - auf de.selfhtml.org gibts einen guten Artikel über CSS Navigation - da gibts so ein Beispiel, ich habs nur entpsrechend mit viel Geduld mal umgebaut - lustigerweise geht dieses Beispiel aber auch nicht im IE6 (habs grad probiert)

Um eine Lösung zu finden denke ich liegts an diesen Zeilen im Script:

#cssmenu li:hover ul ul, #cssmenu li:hover ul ul ul,
#cssmenu li.sfhover ul ul, #cssmenu li.sfhover ul ul ul {
    left: -999em;
    }


/* This "unhides" the sub-menus (left: -999em is what hides them) */

#cssmenu li:hover ul, #cssmenu li li:hover ul, #cssmenu li li li:hover ul,
#cssmenu li.sfhover ul, #cssmenu li li.sfhover ul, #cssmenu li li li.sfhover ul {
    left: auto;
    }

Ich weiß ich hab die Angewohnheit meine Kommentare in englisch zu schreiben, da manche meiner Designs auch ins Ausland gehen...

Vielen Dank nochmals für Eure Unterstützung,

Andreas.

 

[neuroleptika]

lustigerweise geht dieses Beispiel aber auch nicht im IE6 (habs grad probiert)

Zeig doch mal den Link zu dem Beispiel von selfhtml.
Ich verstehe aus den Zeilen nicht wie das im IE6 geht.

Du solltest unbedingt die Doctype-Version aus der Datei entfernen.
Das schickt den IE6 in den Quirks-Modus.

<?xml version="1.0" encoding="utf-8"?>

Die Angabe Braucht kein Browser und verursacht viele Probleme im IE

 

[afragner]

ok - das Weglassen der Doctype Version brachte mal den Erfolg, daß der IE6 numehr das Menü an die richtige Stelle setzt - sprich es etwas einrückt.

Die Anregung für dieses Menü holte ich mir von

SELFHTML: Stylesheets / CSS-basierte Layouts / Navigationsleisten

Das geht lustigerweise auch nicht mit dem IE6

Ahja und ich hab bei meinem Dingens sogar JavaScript dabei

sfHover = function() {
    var sfEls = document.getElementById("cssmenu").getElementsByTagName("li");
    for (var i=0; i<sfEls.length; ++i) {
        sfEls[i].onmouseover=function() {
            this.className+=" sfhover";
        }
        sfEls[i].onmouseout=function() {
            this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
        }
    }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

Das sollte doch das Problem lösen?

 

[neuroleptika]

Jo, ich denke schon.

Die Classe sfhover ist ja sogar schon in deiner css berücksichtigt:

#cssmenu li.sfhover ul, #cssmenu li li.sfhover ul, #cssmenu li li li.sfhover ul
    {
    left: auto;
    }

 

[afragner]

jo und warum gehts dann nicht?
Steh ich echt so auf dem Schlauch?

Ich hab das Menü ja schon mal wo realisiert:

LINK entfernt!

Einziger Unterschied: Es ist nicht Strict sondern Transitional - doch selbst wenn ich das austausche gehts noch immer nicht im IE6
Wo bitte ist mein Denkfehler?

 

[afragner]

Heisse Fährte....

So ich bin auf der richtigen Spur - hätte mich ja gewundert, das nicht hinzukriegen, vor allem weil ich an dem Design ja schon mal nächtelang gesessen bin.
Der Fehler liegt in der Einbindung des JavaScripts - sobald ich es heraussen hab meld ich mich wieder!

 

[afragner]

Gelöst!!!

So aber jetzt hab ichs...
Ich hab blöderweise das JavaScript mit

<link rel="javascript......

eingebunden.
Das geht ohne Probleme bei der Validierung als xhtml strict durch, nur der IE6 kapiert das nicht.

Ich hab das JavaScript jetzt mittels

<script type="text/javascript".....

eingebunden und siehe da es funktioniert.

Nochmals vielen Dank an alle die mich hier unterstützt haben!

Andreas