[1BlackOut] Aufklappbares Menü und IE

[Horrid]

Ich benötige Hilfestellung bei der Umsetzung eines aufklappbaren Menüs im IE.

In der Menüleiste auf der rechten Seite oben habe ich zwischen 'Suche' und 'FAQ' ein 'Clan' Menü zum Aufklappen eingebaut:
http://portal.doozer-clan.de/test/

Meine Änderungen in der overall_header_html.php sind in Zeile 143-185 zu finden
http://www.doozer-clan.de/repository/ph ... __view.php

Die zugehörigen Styles sind in der nachfolgenden Datei ganz unten ab Zeile 762 zu finden.
http://www.doozer-clan.de/repository/ph ... __view.php

Getestet habe ich das Menü mit dem Mozilla Firefox Version 3.6.11, bei dem es so funktioniert, wie ich es mir vorstelle. Im IE 8 bekomme ich mit ein wenig Fingerspitzengefühl den ersten Menüpunkt zu packen, aber unter keinen Umständen den zweiten Menüpunkt. Möglicherweise besteht das Problem auch in anderen IE-Versionen, was ich aber noch nicht testen konnte.

Leider verstehe ich von CSS so gut wir gar nichts und habe den bisherigen Zustand per Versuch und Irrtum mit Firebug erreicht. Ich möchte aber ungerne so lange warten, bis ich CSS verstanden und damit umgehen kann, darum erhoffe ich mir von hier den entscheidenden Hinweis.

vielen Dank und falls eine Information fehlt, liefere ich die gerne nach.

[Talk19zehn]

Hello Horrid,

wenn ich das richtig sehe, fehlt ein wenig Platz im unteren Dropdownbereich ( nach Betätigen des Links ).
Was passiert, wenn Du zwischen der Navbar und dem Bereich --> Unbeantwortete Themen • Aktive Themen einen Abstand einfügst?

CSS: Ab Zeile 771 kontrolliere bitte noch einmal Deine Leerzeichen --> bspw. nach Öffnung der geschweiften Klammern.



"Er" hat das Menü ( vermutlich ) oberhalb einer Hintergrundgrafik platziert, die eine entsprechende Höhe ( vgl. Grafik im Original ) ausweist ......... - ?

Viele Grüße

[Horrid]

Danke für Deine Hilfe.

Ich habe den Abstand eingefügt und damit funktioniert auch im IE 8 der Zugriff auf die einzelnen Menüpunkte. Um den Abstand zu erhalten habe ich in der Datei 'common.css' in der Zeile 307 das Attribut 'min-height:150px;' gesetzt.

Siehe hier:
http://www.doozer-clan.de/repository/ph ... __view.php
und auf der Demoseite:
http://portal.doozer-clan.de/test/

Ich dachte, dass das Menü im aufgeklappten Zustand über die anderen Bereiche überlappt (z-index?). Da ich ungerne diesen Abstand beibehalten möchte, bin ich an einer Alternative interessiert.

Das mit den Leerzeichen habe ich hoffentlich richtig verstanden. Da ich aus den Coding Guidelines nicht richtig Schlau wurde, habe ich mich an einer CSS-Datei von ProSilver orientiert.

[Talk19zehn]

Hello

"er" hat bestimmt etwas im "Angebot", denke ich.


Es ist zwar nicht von "ihm"......

Dropdown-Menü

Hier ist die Mutter aller Menüs! Ein Dropdown, das ohne jeden Script-Einsatz funktioniert. Reines, pures CSS - auch für den unsäglichen IE ;o)

http://barrierefrei.e-workers.de/worksh ... menues.php

Große Probleme hatte ich damit nie.

Viele Grüße



Edit:
Meiner Meinung nach sind in den Zeilen 771, 775 und 776 ( Theme ) Leerzeichen nicht behoben?

Code: Alles auswählen

#dzrmenu { float: right; list-style-type:none; margin-right:-20px; padding:0;}

#dzrmenu dl {	position:absolute; top:0; left:0; margin: 0; padding: 0;}
#dzrmenu dt {	margin:0; font-size: 1.1em; float:left;}

So sollte es sein:

Code: Alles auswählen

#dzrmenu {float: right; list-style-type:none; margin-right:-20px; padding:0;}

#dzrmenu dl {position:absolute; top:0; left:0; margin: 0; padding: 0;}
#dzrmenu dt {margin:0; font-size: 1.1em; float:left;}

Vgl. das Konstrukt doch noch einmal mit dem Original.

LG

[Horrid]

Als alle weiteren Versuche fehlschlugen, habe ich es mit einem anderen Menü von Stu Nicholls probiert.
http://www.stunicholls.com/menu/skeleton.html

Dieses Menü habe ich dann als eigenständige Menüleiste eingebaut. Ich bin noch dabei, Schriftfarben und Größen anzupassen, aber ich denke dieses Menü bietet großartige Möglichkeiten eigene Inhalte zu verlinken.

Hier die Änderungen, die ich vorgenommen habe.

• Die CSS-Datei aus dem Download habe ich in den 'theme' Ordner des Styles kopiert und in die 'stylesheet.css' eingetragen.
  ../theme/stylesheet.css
  ../theme/skeleton.css
• Die Javascript Datei aus dem Download habe ich in den 'template' Ordner des Styles kopiert, der Aufruf erfolgt aus der Datei 'overall_header.html' (Zeile 106)
  ../template/stuHover.js
  ../template/overall_header.html
• Die Menüdefinition ist ebenfalls in der Datei 'overall_header.html' in den Zeilen 163 - 277 untergebracht

Das alles ist zwar nicht perfekt, funktioniert zunächst aber wie gewünscht. Verbesserungen werden mit Steigerung des Kenntnisstandes einfließen

Vielen Dank für die Hilfe und bisherigen Ratschläge, es wird wohl aber nicht das letzte sein, was man hier von mir liest.