Hi als ich habe auf folgender Seite ein dropdown menü entdeckt welches mir gut gefällt, ich würde es gerne nachbauen
(http://barrierefrei.e-workers.de/workshops/tricks/menues.php)
grafisch klappt es auch nur wenn ich die html seite öffne und auf einen menüpunkt im dropdown menü klicken möchte, geht das menü wieder zu bevor ich den Link klicken kann, weiß nicht mehr weiter wer kann mir helfen bitte bitte
hier ist mal der quelltext der html Seite
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD>
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<META content="MSHTML 6.00.5730.11" name=GENERATOR>
<link rel="stylesheet"
href="dropdown.css">
<link rel="stylesheet"
href="fix-ie.css">
</HEAD>
<BODY>
<div id="menuebox">
<div id="menue">
<div class="aussen">
<span class="menutag">Produkte</span>
Systeme
Speicher
Laufwerke
Monitore
Drucker
Zubehör
</div>
<div class="aussen">
<span class="menutag">Leistungen</span>
Netzwerke
Server
Wartung
</div>
<div class="aussen">
<span class="menutag">Service</span>
Reparatur
Konfiguration
Software
Schulung
</div>
<div class="aussen">
<span class="menutag">Links</span>
About Us
Partner
Referenzen
</div>
</div>
<!-- Der folgende Block bedient nur IEs!
Durch diese Redundanz vermeiden wir den Einsatz von Javascript. -->
<!--[if IE]>
<div class="stupidie">
<a class="auss" href="#"><span class="menutag">Produkte</span>
<table><tr><td>
Systeme
Speicher
Laufwerke
Monitore
Drucker
Zubehör
</td></tr></table>
</a>
<a class="auss" href="#"><span class="menutag">Leistungen</span>
<table><tr><td>
Netzwerke
Server
Wartung
</td></tr></table>
</a>
<a class="auss" href="#"><span class="menutag">Service</span>
<table><tr><td>
Reparatur
Konfiguration
Software
Schulung
</td></tr></table>
</a>
<a class="auss" href="#"><span class="menutag">Links</span>
<table><tr><td>
About Us
Partner
Referenzen
</td></tr></table>
</a>
</div>
<![endif]-->
</div>
</BODY></HTML>
Und hier mal der Quelltext der CSS datei
#menue {
display:none;
}
.stupidie {
display: block;
position: absolute;
top: 5px;
left: 0;
z-index: 200;
}
a.auss {
float: left;
width: 8em;
height: 1.4em;
overflow: hidden;
display: block;
font-weight: bold;
text-align: center;
text-decoration: none;
background-color: #dec79a;
color: #513913;
border: 1px solid;
border-color: #d0843e #78561d #78561d #d0843e;
}
a:hover.auss {
overflow: visible;
background-color: #624617;
color: #fff;
}
a:hover.auss table {
display: block;
margin-top: 3px;
background-color: #dec79a;
color: #400;
border-collapse: collapse;
}
a.inn {
display: block;
width: 7.9em; /* fuer 5er IEs anpassen, sonst 'zuckt' es */
padding: 2px 0;
font-size: 100%; /* fuer 5er IEs auf 80% reduzieren */
font-weight: normal;
text-align: center;
text-decoration: none;
border-bottom: 1px solid #78561d;
background-color: #ecd8ae;
color: #600;
}
a:visited.inn {
background-color: #ecd8ae;
color:#444;
}
a:hover.inn {
position: relative;
background-color: #f7eedb;
color: #900;
}
span.menutag {
display: block;
cursor: default;
}