✔ Dropdown Menü mit UL / LI (Reines CSS!) -> :hover Problem unter IE

[MrViktorious]

Hallo liebe CSS- Erfahrene ^^

Ich habe ein CSS Dropdown-Menü Erstellt, welches wirklich nur mit CSS arbeitet, sogar ohne Tabellen und außerdem mehr als ein Unterlevel anzeigen kann.

Unter dem Firefox, sowie dem Netscape funktioniert es vollkommen Problemlos.
Sogar unter dem Internet-Explorer Juhu! Das perfekte CSS-Dropdown Menü!
Nun ja, zu früh gefreut - Es funktioniert unter dem IE (Version 6.0), wenn es auf meinem lokalen Webserver läuft, allerdings will der :hover-Effekt keine Wirkung zeigen, wenn ich es hoch lade !

Eine Testversion mit dem Menü liegt nun auf www.wegital.de

Beim :hover'n über Hauptmenü, Shop und Login sollte ein Untermenü sichtbar sein.

-> Des Weiteren habe ich in den Inhalt ein CSS Dropdown Menü von Stu Nicholls eingebunden (quelle: http://www.cssplay.co.uk/menus/dd_valid.html )
Unter der Original-Seite funktioniert es unter IE und Firefox.

Zu meinem Erstaunen funktioniert es allerdings nicht unter meiner Testseite im IE - nur im Firefox zeigt der Dropdown Wirkung. (Das selbe Problemchen wie mit meinem Menü...)

Was ist da los mit den Menüs, dass die nicht funktionieren, wenn sie auf meinem Webspace liegen, lokal aber ganz normal funktionieren (alle einbundungs-Pfade sind relativ angegeben)

Schaut doch bitte, ob es mit euren Browsern funktioniert, wenn Ihr das hier lest und auch nicht weiter wisst wie ich, könnt ihr zumindest posten, mit welchem Browser und welcher Version es bei euch funktioniert und mit welcher nicht.

Vielen Dank schon mal im Vorraus... ich hoffe, dass mir jemand weiter helfen kann, um endlich wieder ruhig zu schlafen

 

[Twinsetter]

Hi!

Ich habe auch gerade mit ner Homepage angefangen und hatte auch Probleme mit verschiedenen Browsern.
Opera hatte bei mir immer funktioniert, ja und dann ging es auch mit IE aber nicht mit IE7, Firefox, Netscape und diversen anderen.
Bei mir hat das Löschen der <!DOCTYPE... -Zeile geholfen. Als sie noch vorhanden war wurden z.B. Stylesheets nicht von jedem Browser eingebunden, wenn diese in einer externen Datei gespeichert waren.
Warum?
Es gab auch noch andere merkwürdige Effekte. Ich habe diese Zeile erst mal weggelassen.
Mein Seitenlayout habe ich im Wesentlichen von Stu Nicholls übernommen. Trotzdem hats nicht richtig funktioniert. Er bindet aber auf seinen Seiten noch weitere Stylesheets ein, die ich bisher nicht nachvollziehen konnte. Dein Menübeispiel von Stu Nicholls auf Deiner Seite funktioniert bei mir im Opera auch nicht. Das gleiche Menü auf der Stu Nicholls-Website funktioniert ebenfalls nicht.
Bei mir klappts mit der weggelassenen Zeile ganz gut (s. hier). Sicher das Weglassen dieser Zeile ist nicht ganz korrekt - aber es funktioniert erst einmal.

PS: Mit IE6 geht auch nicht aber Netscape 7.1. Versuchs doch mal mit weglassen der DOCTYPE-Zeile

 

[Maik]

Hi,

ich kann dir jetzt nicht genau sagen, warum in deiner Seite Stu Nicholls' Dropdown-Menü im IE6 nicht funktioniert, aber scheinbar kollidiert der Menü-Code mit dem übrigen HTML-Quellcode (Tabellen-Konstrukt), denn wenn ich diesen entferne und den Doctype aus dem Original-Beispiel einsetze, funktioniert das Menü einwandfrei.

Dass dein eigenes Dropdown-Menü via Webserver im IE6 nicht funktioniert, könnte eventuell daran liegen, dass die csshover.htc-Datei nicht im Root-Verzeichnis liegt, also dort, wo sich das HTML-Dokument befindet.

Da die *.htc-Dateien bekanntermaßen einen Javascript-Code enthalten, handelt es sich aus der Sicht des IE auch nicht um ein reines CSS-Dropdown-Menü.

 

[MrViktorious]

@twinsetter: Das Herausnehmen des Doctype hat leider keine Wirkung gezeigt, trozdem danke für den versuchten tip...

@michaelsinterface: Das übernehmen des Doctype von Stu Nicholls, sowie entfernen der umliegenden Tabellen hat bewirkt, dass das Menü von Stu Nicholls schon mal funktioniert - immerhin ein Lichtblick! Vielen Dank

Allerdings will mein Menü immer noch nicht funktionieren. :suspekt: Ich habe auch, so wie du vorgeschlagen hast, die csshover.htc mal in das Verzeichnis gelegt, wo sich die index.php befindet. In meiner style_class_ie.css habe ich dann body { behaviour: url(csshover.htc); } und wechselweise mal url(../../../csshover.htc) gesetzt, da sich die css datei unter ./template/design_1_blue/css/ befindet, doch leider ohne Erfolg.

Ich habe unter www.wegital.de mal alle umfassenden Tabellen weg gelassen.

Das Problem mit meinem Menü ist also noch das alte...
Was mir vor allem Kopfzerbrechen bereitet, ist:
WARUM funktioniert das menü unter meinem lokalen Server einwandfrei, aber im www nich mehr?

...achja, was ich noch anmerkend fragen wollte:

bei stu nicholl's menü sind nach beginn eines <a> -tags und vor den <ul> -tags immer browserweichem mit tabellen:

<!--[if lte IE 6]>
<a href="../menu/index.html">DEMOS
<table><tr><td>
<![endif]-->

...

mein menü hat diese weichen nicht - ist es denn unmöglich ein dropdown im IE ohne neue tabelle zu realisieren? (eigentlich sollte es ja möglich sein, denn lokal funktioniert es ja bei mir....:suspekt: )

 

[Maik]

Warum die csshover.htc-Datei auf deinem Webserver nicht geladen wird, kann ich auch nicht nachvollziehen, bei mir funktionieren auf jeden Fall beide Wege: lokal und im WWW.

Stu Nicholls demonstriert CSS-Dropdown-Menüs, die für den IE kein Javascript benötigen, dafür aber die von dir angemerkten "Conditional Comments", die als IE-Workaround dienen:

<!--[if lte IE 6]>
<a href="../menu/index.html">DEMOS
<table><tr><td>
<![endif]-->

Für dein Dropdown-Menü hingegen ist Javascript (= csshover.htc) erforderlich, damit die Submenüs im IE geöffnet werden.

 

[MrViktorious]

1. Wie kann ich csshover.htc richtig laden?
2. Vor allem: Wie kann ich nachvollziehen, ob csshover.htc geladen wurde?

3. In einem anderen Forum habe ich gelesen, dass manche webserver diese csshover.htc nicht richtig übertragen, da man den mime-type der zu übertragenen .htc dateien ändern müsste... nur wie macht man so etwas, bzw. kontrolliert den mime type?

 

[Maik]

1.) Ich denke, dass du die Pfade zur csshover.htc schon richtig gesetzt hast, nur der Webserver da aus irgend einem Grund nicht mitspielt.

2.) Wenn die Submenüs im IE geöffnet werden.

3.) Kann ich dir leider auch nichts zu sagen.

Alternativ zur csshover.htc kannst du es ja mal mit dem Suckerfish Dropdown probieren.

 

[Twinsetter]

Mal dumme Frage:

Könnte es sein das bei einer Datei die Du in Deine Site einbinden möchtest, der Speicherort außerhalb des Dokumentroot des Webservers liegt und deshalb der Server sich weigert?

Ist nur mal so'ne Frage.

 

[MrViktorious]

@twinsetter: Ich weiß welche Datei Du meinst. Diese Einbindung ist allerdings auskommentiert, war nur als Test gedacht.

@michaelsinterface: VIEEELEN DANK JUHU!
Suckerfish Dropdown war der alles Entscheidende Tipp!
Ich habe mein Menü stark umstrukturiert und die kleine JavaScrpit Funktion eingebettet.
Jetzt funktioniert der Dropdown mittels manipuliertem li.over, was als li:hover im IE wirkt einwandfrei
Nun werde ich das Menü noch auf mehrere Sublevels erweitern, was vergleichsweise einfach sein sollte

Allerdings kann ich das Konstrukt zzt. nur im IE6 und Firefox testen.

Kann jemand von euch kurz www.wegital.de checken und posten, in welchen Browsern es geht und wo es u.U. Probleme gibt?

 

[Maik]

Nun werde ich das Menü noch auf mehrere Sublevels erweitern, was vergleichsweise einfach sein sollte

Da hab ich noch eine Zugabe -> Suckerfish Dropdowns - Perciformes!

Kann jemand von euch kurz www.wegital.de checken und posten, in welchen Browsern es geht und wo es u.U. Probleme gibt?

Konnte keine Auffälligkeiten feststellen Meine Testumgebung: Win2k, Firefox 2.0.0.3, IE6, Mozilla 1.7.12, Netscape 7.0, Opera 9.10, SeaMonkey 1.0.5

Vor allem: Wie kann ich nachvollziehen, ob csshover.htc geladen wurde?

Einfach mal einen Blick in den Ordner "Temporary Internet Files" werfen.