HTML - vertikales Menu nur mit HTML und CSS (kein JS o. PHP)

Multimedia pur!
Beowulf

Re: HTML - vertikales Menu nur mit HTML und CSS (kein JS o.

Beitrag von Beowulf »

Passiert das wieder unter Opera?
Ja, im IE aber auch (wenn der Bildschirm groß genug ist).
Zuletzt geändert von Beowulf am 07.07.2010, 11:19, insgesamt 1-mal geändert.
Benutzeravatar
Fightmeyer
Riesiger Roboteraffe
Riesiger Roboteraffe
Beiträge: 7309
Registriert: 16.12.2004, 22:51
Wohnort: Potsdam
Kontaktdaten:

Re: HTML - vertikales Menu nur mit HTML und CSS (kein JS o.

Beitrag von Fightmeyer »

Das sind insgesamt (momentan...das kann aber eher noch mehr werden...) 12 Links in der 1. Ebene und 21 Links in der 2. Ebene.
Das wären also 33 Links, die dann untereinanderstehen würden und dadurch würde die Übersichtlichkeit doch stark sinken.

Ich hab mal folgenden Codeschnipsel zusammengetragen:

Code: Alles auswählen

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
  <head> 
    <title>Navigation</title> 
    <style type="text/css" media="screen"> 
		#navi, #navi ul { list-style-type:none; margin:0; padding:0; }
		
		#navi li ul { display:none; }
		#navi li:hover ul { display:block; }
		
    </style> 
    
  </head> 
  <body> 

<ul id="navi">
  <li><a href="http://116.203.183.36/forum/topic?start=15&t=16827#">A1</a></li>
  <li><a href="http://116.203.183.36/forum/topic?start=15&t=16827#">B1</a>
    <ul>
      <li><a href="http://116.203.183.36/forum/topic?start=15&t=16827#">B2</a></li>
      <li><a href="http://116.203.183.36/forum/topic?start=15&t=16827#">B2</a></li>
      <li><a href="http://116.203.183.36/forum/topic?start=15&t=16827#">B2</a></li>
    </ul>
  </li>
  <li><a href="http://116.203.183.36/forum/topic?start=15&t=16827#">C1</a>
    <ul>
      <li><a href="http://116.203.183.36/forum/topic?start=15&t=16827#">C2</a></li>
      <li><a href="http://116.203.183.36/forum/topic?start=15&t=16827#">C2</a></li>
      <li><a href="http://116.203.183.36/forum/topic?start=15&t=16827#">C2</a></li>
    </ul>
  </li>
  <li><a href="http://116.203.183.36/forum/topic?start=15&t=16827#">D1</a></li>
</ul>

  </body> 
</html>

Der macht im Grunde schon das, was ich will, nur soll das halt nicht mit "HOVER" funktionieren, sondern erst beim Anklicken sich ausklappen und beim Anklicken eines anderen 1.Ebene-Elements sich wieder einklappen und dann das neue ausklappen.
Beowulf

Re: HTML - vertikales Menu nur mit HTML und CSS (kein JS o.

Beitrag von Beowulf »

Wie Sinus schon sagte, das klappt wirklich nur mit JavaScript.
Benutzeravatar
Fightmeyer
Riesiger Roboteraffe
Riesiger Roboteraffe
Beiträge: 7309
Registriert: 16.12.2004, 22:51
Wohnort: Potsdam
Kontaktdaten:

Re: HTML - vertikales Menu nur mit HTML und CSS (kein JS o.

Beitrag von Fightmeyer »

Wär ja auch zu schön gewesen...
Da hat von euch nicht zufällig jemand einen entsprechenden Scriptschnipsel zur Hand?

Hab jetzt doch noch was gefunden, was angeblich ohne Javascript funktioniert.
http://www.cssplay.co.uk/menus/new-dropdown.html#top2

Im Grunde ist es genau das, was ich suche, nur halt horizontal. Leider blick ich im Quelltext so was von überhaupt nicht durch... Kriegt das einer von euch auf vertikal umgebastelt?
Benutzeravatar
MarTenG
Riesiger Roboteraffe
Riesiger Roboteraffe
Beiträge: 5490
Registriert: 20.07.2004, 11:59
Wohnort: im holden Land

Re: HTML - vertikales Menu nur mit HTML und CSS (kein JS o.

Beitrag von MarTenG »

sinus hat geschrieben:hab keinen Opera installiert :oops:
Mußt du ja auch nicht nur um mal etwas zu testen:
http://www.thindownload.com/
„Schritte, die man getan hat, und Tode, die man gestorben ist, soll man nicht bereuen."
Hermann Hesse, Heimat
"Ich weiß, dass ich mal dinge gewusst habe, die mir, bevor ich sie vergessen habe, überhaupt nichts genützt haben. Und doch vermisse ich sie."
Horst Evers, Wäre ich du, würde ich mich lieben
Beowulf

Re: HTML - vertikales Menu nur mit HTML und CSS (kein JS o.

Beitrag von Beowulf »

@Fightmeyer: Tut mir Leid, dies ist ein ziemlich dreckiger Hack, der mit großen negativen margin-Werten und ähnlichen ungewissen Dingen arbeitet. So richtig durchblicken tu ich da nicht.
Antworten