Navigation, die alles andere wegdrückt

[Oliver]

Hallo liebes Forum.
Ich will eine Navigation erzeugen:
Wenn man auf einen Link klickt soll darunter eine kleine Übersicht kommen.
So:

LINK
   blabla.
   blabla..
   blabal...
nächster LINK

Wie schaffe ich es aber, dass sich das erscheinende Menü nicht über den Text legt sondern den nächsten LINK nach unten drückt?

Vielen herzlichen Dank, Oli

[Ingo Turski]

Hi,

wenn Du den Link anklickst, öffnet sich doch eine neue Seite. Wo ist das Problem, in dieser das entsprechend erweiterte Menü auszugeben?

freundliche Grüße
Ingo

[Oliver]

Hi.

wenn Du den Link anklickst, öffnet sich doch eine neue Seite. Wo ist das Problem, in dieser das entsprechend erweiterte Menü auszugeben?

Nein, das Menü soll sich eigentlich bei onmouseover öffnen (das wollte ich dann noch anpassen).

Sorry. Ich habe wohl etwas schlecht erklärt.

[Ingo Turski]

Hi,

dann verwende z.B. eine ganz normale verschachtelte Liste _ohne_ Positionierungsangaben, in der Du die Abstände ausschliesslich über margin/padding regelst. Wenn Du hier dann einen Zweig von disply:none auf :block änderst, sollte er sich den erforderlichen Platz schon selbst nehmen.

freundliche Grüße
Ingo

[Oliver]

Hallo.

dann verwende z.B. eine ganz normale verschachtelte Liste _ohne_ Positionierungsangaben, in der Du die Abstände ausschliesslich über margin/padding regelst. Wenn Du hier dann einen Zweig von disply:none auf :block änderst, sollte er sich den erforderlichen Platz schon selbst nehmen.

Sorry, aber ich bin kein so guter JavaScripter. Wie muss ich das denn dann mit dem onmouseover="[was kommt hier rein?]" machen?

Danke, Oli

[Oliver]

Hi

Hat denn nicht jemand einen Link?

Danke Oli

[KD-one]

Hi Oliver,

Hat denn nicht jemand einen Link?

Etwas ungeduldig?
Bedenke, heute ist Sonntag, gemeinhin der Tag, den man mit der Familie verbringt.
http://selfhtml.teamone.de/javascript/intro.htm#javascript_htmltags
http://selfhtml.teamone.de/javascript/sprache/eventhandler.htm
http://selfhtml.teamone.de/javascript/sprache/objekte.htm#vordefinierte
http://selfhtml.teamone.de/javascript/sprache/objekte.htm#this
http://selfhtml.teamone.de/javascript/sprache/funktionen.htm
http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#display
http://selfhtml.teamone.de/javascript/objekte/htmlelemente.htm#li

Gruß

Kurt

[Oliver]

Hallo.

Etwas ungeduldig?
Bedenke, heute ist Sonntag, gemeinhin der Tag, den man mit der Familie verbringt.

Danke für die Info.
Ich habe es selber aber auch gerade geschafft:
Ich sage: overflow:hidden und mit JS ändere ich dann das hidden um.

Vielen Dank für deine Hilfe Oli

[Ingo Turski]

Hi,

Ich sage: overflow:hidden und mit JS ändere ich dann das hidden um.

wie bitte? Was hat overflow damit zu tun? Und was soll das für eine Änderung von hidden nach hidden sein? ;-)

Übrigens habe ich Deine Frage mal als Anregung genommen, und lasse meine doch ein wenig unübersichtliche SiteMap jetzt aus- und einklappen.

freundliche Grüße
Ingo

[Oliver]

Hallo.

wie bitte? Was hat overflow damit zu tun? Und was soll das für eine Änderung von hidden nach hidden sein? ;-)

Hast Recht, das tut es nicht. Am Anfang hat es das irgendwie getan.

Übrigens habe ich Deine Frage mal als Anregung genommen, und lasse meine doch ein wenig unübersichtliche SiteMap jetzt aus- und einklappen.

Deine SiteMap ist wirklich gut, aber der Quelltext ist mir etwas zu lang zum übernehmen.

Aber kommen wir zu mir zurück: Ich habe etwas neues entdeckt:
[link:http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#visibility}
Wie schaffe ich es aber nun, dass dort kein Platzhalter ist. Also, dass der restl. Text wirklich weggedrückt wird?

Danke Oli

[Ingo Turski]

Hi,

Deine SiteMap ist wirklich gut, aber der Quelltext ist mir etwas zu lang zum übernehmen.

Danke. Aber wieso lang und wieso übernehmen? Der Code ist so effektiv wie möglich und die ersten zwei LI-Elemente der Sitemap in Verbindung mit dem JavaScript-Code im head sollten Dir schon zeigen, wie das funktioniert.

[link:http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#visibility}
Wie schaffe ich es aber nun, dass dort kein Platzhalter ist. Also, dass der restl. Text wirklich weggedrückt wird?

visibility:hidden kannst Du Dir wie ein getarntes Raumschiff vorstellen - den Platz nimmt es trotzdem ein..;-)
Wie gesagt: die ersten zwei kleinen Javascriptfunktionen in meiner Sitemap solltest Du Dir doch nochmal genauer ansehen.

freundliche Grüße
Ingo

[Oliver]

Hallo.

Danke. Aber wieso lang und wieso übernehmen? Der Code ist so effektiv wie möglich und die ersten zwei LI-Elemente der Sitemap in Verbindung mit dem JavaScript-Code im head sollten Dir schon zeigen, wie das funktioniert.

Also, ich habe jetzt einen kürzeren Weg gefunden mit display (http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#display)

Wie gesagt: die ersten zwei kleinen Javascriptfunktionen in meiner Sitemap solltest Du Dir doch nochmal genauer ansehen.

Ich schau sie mir mal an.

Vielen Dank für alles Oli

[Michael Wronna]

hallo oli

rohentwurf: musst du noch ausbauen, habe ich schnell
gepastelt. beachte: ie nur a:hover. gruss,

michael

<html><head><title>Menu-Test</title>
<style type="text/css" media="screen">
ul.level2 { display: none; }
li:hover > ul { display: block; }
</style></head><body><h1>Menu-Test</h1>
<ul class="level1">
 <li>Eintrag</li>
 <li>Eintrag</li>
 <li>Untermenue<ul class="level2">
  <li>Eintrag</li>
  <li>Eintrag</li>
 </ul></li>
 <li>Eintrag</li>
 <li>Untermenue<ul class="level2">
  <li>Eintrag</li>
  <li>Eintrag</li>
 </ul></li>
 <li>Eintrag</li>
 <li>Eintrag</li>
</ul>
</body></html>

ss:) zu:) ls:& fo:) de:> va:) ch:? n4:& rl:? br:< js:| ie:% fl:{ mo:|

[Ingo Turski]

Hi,

gepastelt. beachte: ie nur a:hover.

richtiger wäre hier die Bemerkung, daß es im IE überhaupt nicht funktioniert.
Denn sobald der Link verlassen wird, ist der hover-Zustand beendet und die gerade geöffneten Elemente wieder weg.

freundliche Grüße
Ingo

[Michael Wronna]

hallo ingo,

hast ja recht, so eine schei..e! wann wird sich mein spezieller
freund bill endlich dazu bewegen lassen seinen browser den
empfehlungen und standards des w3c entspechend auzuliefern?
ist echt zum kotzen. sorry, dass du nun mein missmut diesbezueglich
abbekommst. du kannst ja wirklich nichts dafuer. ich habe eben
auch wie wild gebastelt, dass ich es fuer den ie hinbekomme,
leider vergebens. ich werde bills groll auf mich ziehen, wenn ich
empfehle den ie nicht zu benutzen. sorry again,

michael

ss:) zu:) ls:& fo:) de:> va:) ch:? n4:& rl:? br:< js:| ie:% fl:{ mo:|

[Ingo Turski]

Hi,

ich habe eben
auch wie wild gebastelt, dass ich es fuer den ie hinbekomme,
leider vergebens.

eine vorherige logische Überlegung hätte Dir hier viel Zeit und Frust erspart:

1. :hover geht im IE nur für Links
2. Links dürfen nicht ineinander geschachtelt werden
3. Ergebnis -> Umsetzung im IE nicht möglich.

freundliche Grüße
Ingo