zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden CSS Dropdown Navigations

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 04.10.2012, 03:51
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 04.10.2012
Beiträge: 3
Cueball befindet sich auf einem aufstrebenden Ast
Standard CSS Dropdown Navigations

Hey Leute,

also kurz zu meinen skills in sachen css und html. Bin in der hinsicht ein blutiger anfänger das was ich weiß habe ich mir selber zusammengelesen aus verschiedenen büchern und foren und habe auch versucht nur das umzusetzen was ich verstehe. Doch jetzt habe ich ein großes problem wo ich schon mehrere Tage dran sitze. Ich möchte gerne ein dropdown menü über css laufen lassen aber natürlich später mit jquery (das soll aber wirklich erst später sein will erstmal das grundgerüst für css haben). Ich habe jetzt mehrere codes ausprobiert und im Internet recherchiert, doch das Problem das ich habe ich bekomme keinen Hover effekt rein, sprich das das menü erst aufklappt wenn ich mit der maus über das hauptmenü gleite.

Bei dem ganzen handelt es sich hier um eine horizontale navigation.

Ich hoffe ihr könnt mir schnell weiter helfen.

HTML Code:


<div id="navi">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Gilde</a>
<ul id="subnav-2">

<li><a href="/tools/csstabs/2">People</a></li>
<li><a href="/tools/csstabs/2">Careers</a></li>
<li><a href="/tools/csstabs/2">Press</a></li>
</ul></li>
<li><a href="#">Bewerbung</a></li>
<li><a href="#">Forum</a></li>
<li><a href="#">Gästebuch</a></li>
</ul>
</div><!-- END #nav -->

CSS Code:


div#navi
{
font-size: 0.9em;
font-weight: bold;
padding: 40px 0px;
}

div#navi ul
{
list-style-type: none;
}

div#navi li
{
float: left;
margin-left: 5px;
}

div#navi a
{
display: block;
padding: 5px;
width: 130px;
height: 50px;
background-image: url(images/button2.png);
background-size:650px auto;
-webkit-background-size: 140px auto;
color: #68228B;
text-decoration: none;
text-align:center;
vertical-align:middle;
display:table-cell;
}

div#navi a:visited
{
color: #F00;
}

div#navi a:hover
{
color: #8B0000;
background-image: url(images/button);
}


div#navi #subnav-1:hover,
div#navi #subnav-2:hover,
div#navi #subnav-3:hover,
div#navi #subnav-4:hover {
display : inline;
width: 90%;
}
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 04.10.2012, 06:42
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 10.01.2010
Beiträge: 1.101
MrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer Mensch
Standard

Hallo,

so kann das nicht funktionieren, es fehlt z. B. das gesamte html-Gerüst.

Ergänze bitte den fehlenden Teil und stell' die gesamte Seite online, dann kann dir am besten geholfen werden.

Grundlegende Informtionen und praktische Beispiele zur horizontalen Navigation findest du z. B. unter

http://de.selfhtml.org/css/layouts/n...onsleisten.htm

Gruss

MrMurphy

Geändert von MrMurphy (04.10.2012 um 07:06 Uhr)
Mit Zitat antworten
Sponsored Links
Antwort

Stichwörter
dropdown-navi, hovereffekt

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
Redesign für Steiner Cycling Team pkipper Site- und Layoutcheck 11 09.02.2011 13:25
Einbindung von frei erhältlichen Scripten - CSS Problem DonL CSS 1 22.01.2011 17:09
CSS Dropdown Menü Moepmann123 CSS 9 03.07.2009 23:03
Wege zum guten CSS - Ausgewählte Links Sp33dy G0nz4l3s Ressourcen 1 27.05.2008 12:09
CSS Dropdown menu horizontal...Help please ... Oni CSS 4 09.04.2008 10:48


Alle Zeitangaben in WEZ +2. Es ist jetzt 02:58 Uhr.