Probleme mit aufklapp-navi

Greg10

Also ich benutze folgenden HTML Code:

Code

<div id="change">
<a id="c_hover">
<div id="change_menu"></div>
<img id="c_button" alt="Change to" src="images/start/button.png" width="113" height="30" /></a>
</div>

und folgendes CSS:

Code

div#change {
	position:fixed;
	bottom:0px;
	left:0px;
	z-index:100;
}
div#change img#c_button {
	border-top:1px solid #cccccc;
	border-right:1px solid #cccccc;
	margin:0px;
	padding:0px;
}
div#change a#c_hover {
	margin:0px;
	padding:0px;
}
div#change a#c_hover:hover div#change_menu{
	display:block;
}
div#change a#c_hover:hover img#c_button {
	border-top:0px none #ffffff;
}
div#change_menu {
	width:400px;
	height:150px;
	background-color:#ffffff;
	display:none;
	border-top:1px solid #cccccc;
	border-right:1px solid #cccccc;
	border-top:1px solid #cccccc;
	border-bottom:1px solid #cccccc;
	padding:10px;
	margin:0px;
}

Alles anzeigen

Soweit funktioniert das auch alles, die navi geht auf und bleibt auch offen solange gehovert allerdings klappt sobald ich links in den div mit der id change_menu eintrage nichts mehr. Die Navi klappt einfch nicht mehr auf.

Schonmal im Vorraus viele dank für die hilfe.

Greg10

Hat denn niemand eine Lösung?
Es geht um ein für mich persönlich relativ wichtiges Projekt...

Bandit

Es wäre gut, wenn man sich das mal richtig ansehen könnte.

Ein Tipp: http://www.cssplay.co.uk/menus/ Dort findest du jede Menge Menüs, die nur auf CSS basieren.

Sensei

hab hier für dich auch nochmal ein Tutorial auf deutsch

http://barrierefrei.e-workers.de/workshops/tricks/menues.php

Greg10

Konnte es lösen:
benutze jetzt folgendes HTML:

Code

<div id="change" class="<?=$class?>">
	<a name="top" class="button"></a>
	<div id="change_menu"><!-- links go here --></div>
</div>

und dieses CSS:

Code

#change {
	position:fixed;
	top:200px;
	left:0px;
	z-index:100;
}
#change_menu {
	position: absolute;
	left: -999em;
}


#change:hover #change_menu {
	left: auto;
}

Alles anzeigen

Vielen dank an dich, bandit durch deinen link ist mir der son of suckerfish (http://htmldog.com/articles/suckerfish/dropdowns/) eingefallen. Mit der links-vershciebungsmethode klappts jetzt einwandfrei

Tags