Autor |
Nachricht |
Benutzer 4545
Account gelöscht Threadersteller
Ort: -
|
Verfasst Mi 10.10.2007 08:57
Titel horizontales dropdownmenü verändern |
|
|
hallo ihr lieben,
es geht um ein horizontales Aufklappmenü. der punkt produkte hat submenüpunkte,
die sich mittels einer liste aufklappen, wie man es so kennt. die hintergrundfarbe
und die schriftfarbe von "produkte" ändert sich beim hovern. der punkt unternehmen
hat keine submenüpunkte. dort soll sich jetzt nur die schriftfarbe, aber nicht der
hintergrund verändern beim hovern. wie realisier ich das am einfachsten?
habs schon mit span probiert aber das funzt leider nicht. dankeschön!
Code: |
<div class="menu">
<ul>
<li><a class="hide" href="../menu/index.html">Produkte</a>
<!--[if lte IE 6]>
<a href="../menu/index.html">Produkte
<table><tr><td>
<![endif]-->
<ul>
<li><a href="vertikal.html" title="The zero dollar ads page">Vertikal</a></li>
<li><a href="../menu/embed.html" title="Wrapping text around images">Plissee</a></li>
<li><a href="../menu/form.html" title="Styling forms">Rollo</a></li>
<li><a href="../menu/nodots.html" title="Removing active/focus borders">Flächenvorhang</a></li>
<li><a href="../menu/nodots.html" title="Removing active/focus borders">Jalousie</a></li>
<li><a href="../menu/nodots.html" title="Removing active/focus borders">Zubehör</a></li>
<li><a href="../menu/nodots.html" title="Removing active/focus borders">Schiene</a></li>
<li><a href="../menu/nodots.html" title="Removing active/focus borders">Stil</a></li>
<li><a href="../menu/nodots.html" title="Removing active/focus borders">Raffrollo</a></li>
</ul>
<!--[if lte IE 6]>
</td></tr></table>
</a>
<![endif]-->
</li>
<li><a href="index.html"><span>Unternehmen</span></a>
<!--[if lte IE 6]>
<a href="index.html">MENUS
<table><tr><td>
<![endif]-->
</li>
</ul>
</div> |
css:
Code: |
.menu {
font-family: verdana, sans-serif;
width:760px;
height:22px;
position:relative;
top: 63px;
left:20px;
font-size:11px;
z-index:100;
}
.menu ul li a, .menu ul li a:visited {
display:block;
text-decoration:none;
color:#000;
width:116px;
height:22px;
text-align:center;
color:#000;
line-height:20px;
font-size:11px;
overflow:hidden;
padding-top:2px;
}
.menu ul {padding:0; margin:0;list-style: none;}
.menu ul li {float:left; position:relative;}
.menu ul li ul {display: none;}
.menu ul li:hover a {color:#AD141A; background-color:#F5E4D2;}
.menu ul li:hover a span {color:#AD141A; background-color:none;}
.menu ul li:hover ul {display:block; position:absolute; top:22px; left:0; width:116px;}
.menu ul li:hover ul li a {display:block; background:#FEFDFA; color:#504E53;}
.menu ul li:hover ul li a:hover {background:#D8DADC; color:#AD141A;} |
|
|
|
|
|
fuchsbau
Dabei seit: 15.08.2005
Ort: .//root
Alter: 40
Geschlecht:
|
Verfasst Mi 10.10.2007 09:38
Titel
|
|
|
Code: | <li class="menuhoveronly"><a href="index.html">Unternehmen</a> |
Code: | .menu ul li.menuhoveronly:hover a {color:#AD141A; background-color:transparent;} |
sollte gehen, falls ich das richtig verstanden habe.
habbich?
Zuletzt bearbeitet von fuchsbau am Mi 10.10.2007 09:40, insgesamt 1-mal bearbeitet
|
|
|
|
|
Anzeige
|
|
|
Benutzer 4545
Account gelöscht Threadersteller
Ort: -
|
Verfasst Mi 10.10.2007 10:28
Titel
|
|
|
supi das wars, in ff gehts aber in ie nicht...hatte gedacht es geht so
Code: |
menu. li .menuhoveronly a:hover{color:#AD141A; background-color:transparent;}
|
wegen dem a:hover in ie aber das tuts nicht...
|
|
|
|
|
fuchsbau
Dabei seit: 15.08.2005
Ort: .//root
Alter: 40
Geschlecht:
|
Verfasst Mi 10.10.2007 12:17
Titel
|
|
|
von welchem IE redest du? 7 funzt meins eigentlich, 6 habbich jetzt nich probiert...
|
|
|
|
|
Benutzer 4545
Account gelöscht Threadersteller
Ort: -
|
Verfasst Mi 10.10.2007 12:19
Titel
|
|
|
sorry. hab version 6.
|
|
|
|
|
fuchsbau
Dabei seit: 15.08.2005
Ort: .//root
Alter: 40
Geschlecht:
|
Verfasst Mi 10.10.2007 12:34
Titel
|
|
|
mmh, mein ie6 zerschießt dein komplettes menü, daher hab ich da garnicht drauf geachtet... gucks mir dann nochmal an
|
|
|
|
|
Benutzer 4545
Account gelöscht Threadersteller
Ort: -
|
Verfasst Mi 10.10.2007 13:13
Titel
|
|
|
ups sorry hier das css für ie...
Code: |
table {border-collapse:collapse; margin:0; padding:0; z-index:1;}
.menu ul li a.hide, .menu ul li a:visited.hide {display:none;}
.menu ul li a:hover ul li a.hide {display:none;}
.menu ul li a:hover {color:#AD141A; background-color:#F5E4D2;}
.menu ul li a:hover ul {display:block; position:absolute; top:22px; left:0; width:116px;}
.menu ul li a:hover ul li a {display:block; background:#FEFDFA; color:#000;}
.menu ul li a:hover ul li a:hover {background:#D8DADC; color:#AD141A;}
.menu ul li .menuhoveronly a:hover{color:#AD141A; background-color:transparent;}
|
|
|
|
|
|
|
|
|
Ähnliche Themen |
Problem mit Css Dropdownmenü
DropdownMenü und Verlinkung
Konflitkt mit CSS Dropdownmenü
Dropdownmenü für Downloadauswahl
dropdownmenü per css spinnt! [solved]
Exell-> Dropdownmenü/Pulldownmenü ???
|
|