Ausklappmenu

[Dieter Raber]

Hallo alle,

Wir haben hier ja haeufig Fragen bzgl. (DHTML)-Ausklappmenus. Bei Dr. Web habe ich dieses hier gefunden, das vielleicht den ein oder anderen interessiert. Im Firefox funktioniert es mit CSS, im IE mit Behaviors.

Wie neu, zuverlaessing und wasserdicht es ist, habe ich allerdings nicht getestet.

Gruß,

Dieter

[Christoph Schnauß]

hallo Dieter,

Bei Dr. Web habe ich dieses hier gefunden

Ich gebe zu, daß ich immer noch ein paar Vorbehalte gegenüber Dr.Web habe. Im Lauf der Jahre haben sich zwar die dargestellten Beispiele deutlich gebessert und sind durchaus mal einen Seitenblick wert, aber die "Hauptseite" selbst finde ich nach wie vor bescheuert. Nicht nur wegen der Werbung. Naja, aber was solls.

Interessieren würde mich aber schon, was dir an http://de.selfhtml.org/css/layouts/navigationsleisten.htm nicht genügt hat und wo du da eventuell noch Nachhol- oder Korrekturbedarf siehst.

Grüße aus Berlin

Christoph S.

[Cybaer]

Hi,

Ich gebe zu, daß ich immer noch ein paar Vorbehalte gegenüber Dr.Web habe.

Absolut zurecht.

Im Lauf der Jahre haben sich zwar die dargestellten Beispiele deutlich gebessert und sind durchaus mal einen Seitenblick wert,

Ja. Leider muß man sich im Prinzip selbst mit der Materie auskennen, um bewerten zu können, ob die Umsetzung des jeweiligen Tips gut oder hirnrissig ist.

Gruß, Cybaer

[Dieter Raber]

Hallo Christoph,

Interessieren würde mich aber schon, was dir an http://de.selfhtml.org/css/layouts/navigationsleisten.htm nicht genügt hat und wo du da eventuell noch Nachhol- oder Korrekturbedarf siehst.

Ich habe garnichts daran auszusetzen. Ich fand das Menu von Dr. Web einfach nett und dachte, der ein oder andere hier wuerde sich vielleicht dafuer interessieren.

Gruß,

Dieter

[Felix Riesterer]

Lieber Dieter,

Wie neu, zuverlaessing und wasserdicht es ist, habe ich allerdings nicht getestet.

und warum preist Du es hier dann "nur zur Info" an?

Der Code bei Dr. Web basiert auf einer verschachtelten <ul>, wie es auch in SelfHTML bei den CSS-Navi-Leisten vorgestellt wurde. Für den IE verwendet man bei Dr. Web die CSShover.htc von Peter Nederlof, was hier im Forum auch schon erwähnt wurde. Also nix neues.

Darüber hinaus schreiben die bei Dr. Web semantisch Fragwürdiges:

 <div id="menu">  
<ul>  
<li><h2>Titel 1</h2>  
  <ul>  
  <li><a href="#">eins</a></li>  
  <li><a href="#">zwei ...</a>  
    <ul>  
    <li><a href="#">zwei a</a></li>  
    <li><a href="#">zwei b</a></li>  
...  
</ul>  
</div>

Warum schreibt man die <ul> in ein <div>? Warum steht im ersten <li> eine <h2>? Bei Dr. Web haben sie wohl die Semantik noch nicht kapiert! Es muss heißen:

<div id="menu">  
<h2>Navi-Titel</h2>  
<ul>  
  <li><a href="#">eins</a></li>  
  <li><a href="#">zwei ...</a>  
    <ul>  
    <li><a href="#">zwei a</a></li>  
    <li><a href="#">zwei b</a></li>  
...  
</ul>  
</div>

Liebe Grüße aus Ellwangen,

Felix Riesterer.

[Dieter Raber]

Hallo Felix,

Wie neu, zuverlaessing und wasserdicht es ist, habe ich allerdings nicht getestet.
und warum preist Du es hier dann "nur zur Info" an?

Weil ich eine keine Frage zum Thema CSS hatte, sondern eine Information, naemlich, dass ich ein Menü gefunden habe, dass den ein oder anderen interssieren mag.

Gruß,

Dieter

[Schuer]

Wie neu, zuverlaessing und wasserdicht es ist, habe ich allerdings nicht getestet.

Es hat das Problem mit den fehlenden Randbereichen, wodurch die Benutzbarkeit erschwert wird. Diese Variante macht es besser und zeigt durch die roten Rahmen, worauf es ankommt: http://www.positioniseverything.net/css-dropdowns-red.html

Viele Grüße!
_ds

[at]

Hallo.

Diese Variante macht es besser und zeigt durch die roten Rahmen, worauf es ankommt: http://www.positioniseverything.net/css-dropdowns-red.html

Eigentlich lustig, dass man einen unsichtbaren Bereich nutzen soll, weil einem der sichtbare nicht ausreicht. Da niemand sehen kann, wo der unsichtbare Bereich endet, halte ich es für sinnvoller, den einzelnen Menüpunkten etwas mehr Innenabstand zu gönnen. Damit vergrößert sich die Fläche dann auch visuell.
MfG, at

[Schuer]

Da niemand sehen kann, wo der unsichtbare Bereich endet, halte ich es für sinnvoller, den einzelnen Menüpunkten etwas mehr Innenabstand zu gönnen. Damit vergrößert sich die Fläche dann auch visuell.

Dem würde ich nur teilweise zustimmen, denn der unsichtbare Rand hat neben dem "schlecht Zielen" des Benutzer beim Überfahren der Menüpunkte auch eine andere Absicht: mit dem Mauszeiger zur Seite fahren zu können, um sich einen Überblick verschaffen zu können, ohne dabei die Navigation zu verlieren (typischer Konflikt auch bei Eingabefeldern: der dumme Zeiger steht im Weg, so dass man den Text nicht lesen kann, den man gerade selbst eintippt). Das ginge natürlich auch mit größeren Buttons, die über mehr Innenabstand verfügen, jedoch denke ich, dass man schon aus Gewohnheit gerne mit dem Mauszeiger ganz aus einem Element rausrutscht, wenn man dessen Inhalt betrachten möchte. In diesem Fall würde man dann auch die großen Navigationspunkte verlieren.

Viele Grüße!
_ds

[Cybaer]

Hi,

Dem würde ich nur teilweise zustimmen, denn der unsichtbare Rand hat neben dem "schlecht Zielen" des Benutzer beim Überfahren der Menüpunkte auch eine andere Absicht: mit dem Mauszeiger zur Seite fahren zu können, um sich einen Überblick verschaffen zu können, ohne dabei die Navigation zu verlieren

Hmm, IICR ist dieses "großzügige" Verhalten allerdings nicht gerade üblich bei OS-GUIs. Mir fällt jedenfalls spontan zw. Classic MacOS und WinXP kein GUI ein, das sich so verhält.

Gruß, Cybaer

[Schuer]

Hmm, IICR ist dieses "großzügige" Verhalten allerdings nicht gerade üblich bei OS-GUIs.

Dort arbeitet man auch meist per Klick, nicht per Dropdown schon beim Überfahren. Der Klick klappt das Menü aus und hält es aufgeklappt, bis der Nutzer einen Punkt anwählt, eine andere Rubrik überfährt oder zum Schließen der Navi bewusst "nebenher" klickt.

Eine Alternative zum Klick ist eine Zeitverzögerung beim Schließen, jedoch ist die erstgenannte Methode sicherlich in vielen Fällen angenehmer.

Viele Grüße!
_ds

[Cybaer]

Hi,

Dort arbeitet man auch meist per Klick, nicht per Dropdown schon beim Überfahren.

Jep -> Pull-Down-Menü. Das Atari-TOS hat z.B. ein Drop-Down-Menü.

(...) bis der Nutzer (...) zum Schließen der Navi bewusst "nebenher" klickt.

Wie wäre es dann damit?

Gruß, Cybaer

[Schuer]

Wie wäre es dann damit?

Was meinst du? Eine Dropdown-Navi mit Klick statt nur durch Mouseover? Damit könnte man sich den unsichtbaren "Sicherheitsrahmen" sparen, verbaut jedoch ein paar Klicks mehr auf dem Weg zum (Glück) Inhalt. Ich weiß nicht, ob das sinnvoll ist, und würde es ganz einfach situationsabhängig und aus einem Bauchgefühl heraus machen.

Viele Grüße!
_ds

[Cybaer]

Hi,

Was meinst du? Eine Dropdown-Navi mit Klick statt nur durch Mouseover?

Nein, das wäre ja eine Pull-Down-Navi.Ich dachte eher an ein "Menü bleibt aufgeklappt und klappt erst wieder weg, wenn man einen anderen Punkt anwählt oder irgendwohin klickt".

Damit könnte man sich den unsichtbaren "Sicherheitsrahmen" sparen, verbaut jedoch ein paar Klicks mehr auf dem Weg zum (Glück) Inhalt.

:)

Ich weiß nicht, ob das sinnvoll ist, und würde es ganz einfach situationsabhängig und aus einem Bauchgefühl heraus machen.

Es wäre zumindest ähnlicher der gewohnten Bedienung am PC.

Gruß, Cybaer

PS: Ich persönlich bevorzuge mom. übrigens die Zeitverzögerung. ;-)

[Schuer]

Was meinst du? Eine Dropdown-Navi mit Klick statt nur durch Mouseover?
Nein, das wäre ja eine Pull-Down-Navi.

Soweit ich weiß, besteht kein Unterschied zwischen einem Dropdown und einem Pulldown? Habe aber keine große Lust, das zu recherchieren. Wir wissen ja, was gemeint war.

Viele Grüße!
_ds

[Cybaer]

Hi,

Soweit ich weiß, besteht kein Unterschied zwischen einem Dropdown und einem Pulldown?

Ein Dropdown-Menü fällt *von alleine* runter, wenn man mit der Maus auf den Menüpunkt geht, ein Pulldown-Menü muß der User - mittels Klick auf den Menüpunkt - *aktiv* runterziehen.

Gruß, Cybaer

[Schuer]

Ein Dropdown-Menü fällt *von alleine* runter, wenn man mit der Maus auf den Menüpunkt geht, ein Pulldown-Menü muß der User - mittels Klick auf den Menüpunkt - *aktiv* runterziehen.

Hast du eine Quelle dazu? Ich konnte diesen Punkt auf die Schnelle nirgends im Web bestätigt finden.

Viele Grüße!
_ds

[Cybaer]

Hi,

Hast du eine Quelle dazu?

Nein. Ich habe in meinem Leben halt nur mit diversen GUIs gearbeitet, die auf die eine oder die andere, mitunter auch konfigurierbar mit beiden Varianten bedient wurden.

Und die Hersteller haben das eine halt immer Pulldown-, das andere immer Dropdown-Menü genannt. Das kam mir auch nie unlogisch vor, weswegen ich weder drüber nachgedacht habe, noch zu Nachforschungen angeregt wurde. ;-)

Aber Apples GUI-Usability-Richtlinien sind da IIRC vielleicht eine lohnenswerte Quelle (sind sie bei jedweden GUI-Usability-Fragen aber so oder so ;-))).

Gruß, Cybaer

[Cybaer]

Hi,

Hast du eine Quelle dazu?

http://www.guidebookgallery.org/articles/aguidetoguis

Gruß, Cybaer

[at]

Hallo.

(...) bis der Nutzer (...) zum Schließen der Navi bewusst "nebenher" klickt.

Wie wäre es dann damit?

Nur nebenher: Damit verlässt man den Einflussbereich von CSS.
MfG, at

[Joachim]

Hi,

dieses hier

Ist vielleicht eine gute Gelegenheit darüber zu diskutieren, ob es wirklich Sinn macht, statt einer sauberen, allgemeinen Javascriptlösung diese proprietäre Behavior-Technik zu verwenden, bei der ein Grossteil der Benutzer aber dennoch weiterhin auf Javascript angewiesen ist.

Insofern stellt es für mich nicht wirklich eine Alternative zu einem reinen Javascript-Menue dar, dass Javascriptlose Alternativen besitzt - im Gegenteil. Die Integration der Behavior-Geschichte bedeutet doch einen erheblichen, zusätzlichen Aufwand.

Gruesse, Joachim

[Ingo Turski]

Hi,

Wie neu, zuverlaessing und wasserdicht es ist, habe ich allerdings nicht getestet.

es ist relativ alt,
für Win-IE mit Javascript zuverläsig,
In conditional comments gesetzt auch "wasserdicht" - für Win-IEs.

Allerdings ist es weitaus schlechter als eine rein Javascriptlösung für IEs:
1.) die htc ist sehr rechenintensiv. Die ganzen RegExes und dann noch die Scheife for(var i=0; i<elements.length; i++) mit zig eigentlich unnötigen Abfragen.
2.) Mac-IEs bleiben außen vor; Die SELFHTML-Lösung hatte ich auf Anfrage hier im Forum extra auch für diese Browser noch zugänglich gemacht.
3.) warum sollte man JScript in CSS packen? Das hat da mMn nichts zu suchen.

freundliche Grüße
Ingo