zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden herunterfahrendes Menü mit CSS

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 11.02.2005, 19:58
Benutzerbild von Pablo
4 8 15 16 23 42
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 31.05.2004
Beiträge: 1.773
Pablo sorgt für eine eindrucksvolle AtmosphärePablo sorgt für eine eindrucksvolle Atmosphäre
Standard herunterfahrendes Menü mit CSS

Hi,

ich wollte meine Webseite komplett umdesignen und habe mir gedacht, dass ich mal probieren könnte, so ein DropDown-Menü einzubauen. Nun wollte ich mal etwas besonderes machen und kein JavaScript, sondern CSS verwenden.

Dann hatte ich zwei Ideen.
1.) Man hat drei Layer, bei :hover wird der oberste transparent und man sieht das Menü da drunter (der dritte ist, damit die Überschrift des Menü immer sichtbar bleibt). Hat auch supi geklappt (na ja, supi nicht, aber mehr oder weniger) aber Mr. Internet Explorer hat gestreickt.
2.) Man hat ein div-Container, mit dem gesamten Menü-Inhalt, dieser wird auf height:20px gesetzt. Dann bei :hover wird das Menü auf height:200px gesetzt. Klappte auch, allerdings nicht im IE.

Hat jemand eine Idee, so etwas zu realisieren, oder vielleicht sogar schon so ein fertiges Menü?
Drei Bedinungen:
- reines CSS
- valide (und barrierefrei, aber das wäre ja mehr oder weniger automatisch)
- im IE, FF, OP voll funktionsfähig

Pablo
__________________
Go Opera!
… oder Chrome. Auch cool.
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 27.12.2007, 17:07
Neuer Benutzer
neuer user
 
Registriert seit: 27.12.2007
Beiträge: 6
daisuke befindet sich auf einem aufstrebenden Ast
Standard

Ja ich hab ein CSS Menü für dich alles was du dafür brauchst ist diese CSS Datei.

http://awm.aw.ohost.de/css/menu.css

Damit das ganze auch im IE7 funktioniert musst du dir diese Datei noch downloaden --> http://awm.aw.ohost.de/css/csshover.htc

Das hier wäre der Code den du im Header einfügen musst:
Code:
<link href="css/menu.css" rel="stylesheet" type="text/css">
<!--[if IE]>
<style type="text/css" media="screen">
 #menu ul li {float: left; width: 100%;}
</style>
<![endif]-->

<!--[if lt IE 7]>
<style type="text/css" media="screen">
body {behavior: url(css/csshover.htc); font-size: 100%;}
#menu ul li a {height: 1%;} 
}
</style>
<![endif]-->
Und hier für den Body Bereich:

Code:
<div id="menu">
<ul>
<li><a href="?site=news"><h2>Home</h2></a>
  <ul>
  <li><a href="?site=kontakt">Contact</a></li>
  <li><a href="?site=impress">Impressum</a>

  </li>
  </ul>
</li>
</ul>
<ul>
<li><a href="#"><h2>Bio</h2></a>
  <ul>
  <li><a href="?site=band">Band</a></li>
  <li><a href="?site=andrea">Andrea</a>

  <li><a href="?site=hans">Hans</a>
  <li><a href="?site=harry">Harry</a>
  <li><a href="?site=hubert">Hubert</a>
  </li>
  </ul>
</li>
</ul>
<ul>
<li><a href="#"><h2>Music</h2></a>

  <ul>
  <li><a href="?site=songs">Songs</a></li>
  <li><a href="?site=videos">Videos</a>
  </li>
  </ul>
</li>
</ul>
<ul>
<li><a href="#"><h2>Media</h2></a>

  <ul>
  <li><a href="?site=downloads">Downloads</a></li>
  <li><a href="?site=photos">Photos</a>
  </li>
  </ul>
</li>
</ul>
<ul>
<li><a href="?site=guestbook"><h2>Gbook</h2></a>

</li>
</ul>
<ul>
<li><a href="?site=links"><h2>Links</h2></a>
</li>
</ul>
<ul>
<li><a href="#"><h2>Tour</h2></a>
  <ul>
  <li><a href="?site=termine">Termine</a></li>
  </ul>

</li>
</ul>
</div>
Hoffe es funktioniert

PS: Hab grad auf das Datum geschaut und ich denke diese AW wird dir nicht mehr viel nutzen xD aber vl. anderen Leuten die auch auf der Suche nach soeinem Menü sind.
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Problem mit CSS Menü FuFi CSS 1 05.01.2015 15:46
Problem mit CSS Dropline menü horst77 CSS 1 12.08.2009 11:49
Grafisches Menü (a la Vista) mit CSS tlloyd72 CSS 0 16.04.2008 18:12
CSS Menü - Buttonfrage Ralgar CSS 6 01.12.2006 17:14
Mysteriöses in CSS Dropdown Menü ph!L CSS 3 21.07.2006 12:31


Alle Zeitangaben in WEZ +2. Es ist jetzt 22:44 Uhr.