Untermenüs öffnen sich in Dropdown Menü von wanda, 12.01.2014 19:56

Untermenüs öffnen sich in Dropdown Menü

wanda 12.01.2014 19:56

hää ? ich "plenke" ? was ist das denn ? Kennen wir in der Schweiz nicht :-P

Also hier mal der Code (schäm, aber voller Hoffnung, dass jemand die ganzen Fehler findet und mir nicht dazu abraten will, solch ein Menü haben zu wollen ;-)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
        <head>
                <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
                 <title>CSS3 Accordion Menu von designyourweb.info</title>

h2 {
        font: bold 14px Verdana, Arial, Helvetica, sans-serif;
        color: #000;
        margin: 0px;
        padding: 0px 0px 0px 15px;
}

ul {
        list-style: none;
        margin: 0;
        padding: 0;
        }

img {
border: none;
}

#menu6 {
        width: 200px;
        margin: 10px;
        }

#menu6 li a {
        height: 32px;
          voice-family: ""}"";
          voice-family: inherit;
          height: 24px;
        text-decoration: none;
        }

#menu6 li a:link, #menu6 li a:visited {
        color: #cbe9bf;
        display: block;
        background:  #EAE5E5;
        padding: 8px 0 0 10px;
        }

#menu6 li a:hover, #menu6 li #current {
        color: #4040ff;
        background:  #EAE5E5 0 -32px;
        padding: 8px 0 0 10px;
        }
nav {
    width: auto;
}
nav ul {
    padding: 0px;
    margin: 0px;

-moz-box-shadow: 2px 2px 2px #dfdfdf;
-webkit-box-shadow: 2px 2px 2px #dfdfdf;
box-shadow: 2px 2px 2px #dfdfdf;

border-right: 1px solid #DFDFDF;
    border-bottom: 1px solid #DFDFDF;
}
nav ul:after {
    clear: both;
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    visibility: hidden;
}
nav ul,nav ul li{
    background-color: #FAFAFA;
}
nav ul li {
    list-style: none;
    border-bottom: 2px solid #DFDFDF
}
nav ul li a {
    text-decoration: none;
    display: block;
    color: #333;
    padding: 14px 34px 14px 34px;
}
nav ul li#Tierarten:target a, nav ul li#Tierarten:target > ul li a{
    background-color: #E6DD00;
}
nav ul li#Heimtiere:target a, nav ul li#Heimtiere:target > ul li a{
    background-color: #fdb043;
}
nav ul li#Wildtiere:target a, nav ul li#Wildtiere:target > ul li a{
    background-color: #008C74;
}
nav ul li#Nutztiere:target a, nav ul li#Nutztiere:target > ul li a{
    background-color: #004C66;
}
nav ul li#Wissenswertes:target a, nav ul li#Wissenswertes:target > ul li a{
    background-color: #332B40;
}
nav ul li:target > a {
    color: #FAFAFA;
}
nav ul li:target > ul {
    max-height: 1000px;
}
nav ul li ul{
    display: block;
    position: relative;
    padding: 0px;
    border: none;
    box-shadow: none;
    max-height: 0px;
    overflow: hidden;

-webkit-transition: max-height 0.3s ease-out;
    -moz-transition: max-height 0.3s ease-out;
    -o-transition: max-height 0.3s ease-out;
    -ms-transition: max-height 0.3s ease-out;
    transition: max-height 0.3s ease-out;
}
nav ul li ul li{
float: none;
    display: block;
    border: none;
}
nav ul li ul li a {
    padding-left: 44px;
    color: #FAFAFA;
}
nav ul li ul li a:hover{
color: #333;
background-color: #FAFAFA !important;
}

</style>
</head>

	<div id = "wrapper">

<nav>
         <ul>
         <li id = "Heimtiere">
         <a href="#Heimtiere">Heimtiere</a>
         <ul>
         <li><a href="http://www.stsw.ch/#!katze/c9gv" target="_blank">Katzen</a></li>
         <li><a href="http://www.stsw.ch/#!hund/c16w7" target="_blank">Hunde</a></li>
         <li><a href="http://www.stsw.ch/#!esel/c1aa0" target="_blank">Esel</a></li>
         <li><a href="http://www.stsw.ch/#!pferde/c19ba" target="_blank">Pferde</a></li>
         <li><a href="http://www.stsw.ch/#!nagetiere/cd5m" target="_blank">Nager</a></li>
         <li><a href="http://www.stsw.ch/#!orang-utan/c13rh" target="_blank">Exoten</a></li>
         <li><a href="http://www.stsw.ch/#!tiere-und-klte/c1iuk" target="_blank">Tiere und Kälte</a></li>
         </ul>
         </li>
         <li id = "Wildtiere">
         <a href="#Wildtiere">Wildtiere</a>
         <ul>
         <li><a href="http://www.stsw.ch/#!elefanten/c1qi1" target="_blank">Elefanten</a></li>
         <li><a href="http://www.stsw.ch/#!nashoerner/c1ihr" target="_blank">Nashörner</a></li>
         <li><a href="http://www.stsw.ch/#!tiger/c1vro" target="_blank">Tiger</a></li>
         <li><a href="http://www.stsw.ch/#!lwe/cdhy" target="_blank">Löwen</a></li>
         <li><a href="http://www.stsw.ch/#!bren/c1m7t" target="_blank">Bären</a></li>
         <li><a href="http://www.stsw.ch/#!affen/c1oci" target="_blank">Affen</a></li>
         <li><a href="http://www.stsw.ch/#!orang-utan/c10yj" target="_blank">Orang Utan</a></li>
         <li><a href="http://www.stsw.ch/#!panda/c1pkr" target="_blank">Panda</a></li>
<li><a href="http://www.stsw.ch/#!koala/c1f5s" target="_blank">Koala</a></li>
         <li><a href="http://www.stsw.ch/#!schildkrten/c1gm2" target="_blank">Schildkröten</a></li>
         <li><a href="http://www.stsw.ch/#!pinguine/c18up" target="_blank">Pinguine</a></li>
         <li><a href="http://www.stsw.ch/#!robben/c202t" target="_blank">Robben</a></li>
<li><a href="http://www.stsw.ch/#!wlfe/c1yvr" target="_blank">Wölfe</a></li>
         <li><a href="http://www.stsw.ch/#!eisbaeren/crdz" target="_blank">Eisbären</a></li>
         <li><a href="http://www.stsw.ch/#!schneeleoparden/c23y9o" target="_blank">Schneeleoparden</a></li>
         <li><a href="http://www.stsw.ch/#!polarfuchs/c1iuh" target="_blank">Polarfuchs</a></li>
         <li><a href="http://www.stsw.ch/#!lemuren/c24e7" target="_blank">Lemuren</a></li>
<li><a href="http://www.stsw.ch/#!delfine/c9r0" target="_blank">Delfin</a></li>
         <li><a href="http://www.stsw.ch/#!wale/csby" target="_blank">Wal</a></li>
         <li><a href="http://www.stsw.ch/#!hai/c4re" target="_blank">Hai</a></li>
         <li><a href="http://www.stsw.ch/#!zoo/c1kta" target="_blank">Zoo</a></li>
         <li><a href="http://www.stsw.ch/#!zirkus/c36d" target="_blank">Zirkus</a></li>
         </ul>
         </li>
         <li id = "Nutztiere">
         <a href="#Nutztiere">Nutztiere</a>
         <ul>
         <li><a href="#" target="_blank">Webseiten</a></li>
         <li><a href="#" target="_blank">Themes und Templates</a></li>
         <li><a href="#" target="_blank">Plugins</a></li>
         </ul>
         </li>
         <li id = "Wissenswertes">
         <a href="#Wissenswertes">Wissenswertes</a>
         <ul>
         <li><a href="#" target="_blank">Deutschland</a></li>
         <li><a href="#" target="_blank">Amerika</a></li>
         <li><a href="#" target="_blank">Spanien</a></li>
         </ul>
         </li>
         </ul>
         </nav>
   </div>
    </body>
</html>

Beitrag melden

– Informationen zu den Bewertungsregeln

SELFHTML Forum - Ergänzung zur Dokumentation Übersicht

wanda: Untermenüs öffnen sich in Dropdown Menü

Beitrag lesen

Untermenüs öffnen sich in Dropdown Menü

Untermenüs öffnen sich in Dropdown Menü

Vollzitate