Navi aufklappen

  • Hallo,


    ich möchte gerne eine "aufklappbare" Steuerung erstellen.
    Ich habe es nun soweit geschafft, dass es aufklappt beim draufklicken mit der Maus.
    Jetzt möchte ich gerne, dass wenn ich auf den menüpunkt draufklicke auch eine Seite dazu geöffnet wird. Bisher werden nur die Unterpunkte der Navigation geöffnet. Wer kann mir helfen? Danke schon mal


    Hier mal der Quelltext:


    > <style type="text/css">
    > body { font: normal 100.01% Arial, sans-serif;
    > color: #27408B;
    > background-color: #FFF68F;
    > width: 170px; margin-left: ; padding: 0em 0em 0em
    > 0.8em; }
    >
    >
    > #Navi { font-family:
    > Arial, sans-serif; color: #FFF68F;
    > background-color: #1E90FF;
    > font-size: 0.82em; float:
    > left; width: 160px; margin: 0; padding: 0.20em;
    > line-height: 1.2em;
    > text-align: right; letter-spacing: 0.1em; }
    > #ID { font-family: Arial, sans-serif;
    > font-size: 0.79em; color:#FFF68F;
    > background-color: #87CEFA; width: 160px; }
    > #Navi a:link { color:
    > #FFF68F; text-decoration: none; background-color:
    > #1E90FF; }
    > #Navi a:hover { color: #27408B;
    > text-decoration: none; background-color: #1E90FF;
    > width: 160px; }
    > #Navi a:visited { color: #8B2323;
    > text-decoration: none; background-color: #1E90FF;
    > width: 160px; }
    > #ID a:link { color:
    > #27408B; text-decoration: none; background-color:
    > #87CEFA; }
    > #ID a:hover { color:
    > #FFF68F; text-decoration: none; }
    > #ID a:visited { color:
    > #FFF68F; text-decoration: none; }
    >
    > #ID2 { font-family: Arial,
    > sans-serif; font-size: 0.80em; color:#FFF68F;
    > background-color: #87CEFA; width: 160px; }
    > #ID2 a:link { color:
    > #27408B; text-decoration: none; background-color:
    > #87CEFA; }
    > #ID2 a:hover {
    > background-color: #27408B; text-decoration: none;
    > }
    > #ID2 a:visited {
    > background-color: #27408B; text-decoration: none;
    > }
    > #hr { color: #27408B;
    > align: center; width: 140px; }
    > </style>
    >
    > <script
    > type="text/javascript" language="javascript">
    >
    > function outline(id)
    > {
    > if(document.getElementById(id).style.display ==
    > 'none')
    > {
    > document.getElementById(id).style.display =
    > 'block'; }
    > else {
    > document.getElementById(id).style.display =
    > 'none';}
    > }
    >
    > </script>
    >
    > </head>
    >
    > <body>
    >
    > <div id="Navi">
    > <a href="index.htm"
    > target="rechts">Startseite</a><br
    > /><hr align="center" color="#27408B"
    > width="160px" size="2px">
    > <a href="geschichte.htm"
    > target="rechts">Wie alles
    > begann</a><br /><hr align="center"
    > color="#27408B" width="160px" size="2px">
    > <a href="touren.htm" onclick="outline('ID');
    > return false;"
    > target="rechts">Touren</a><br
    > /><hr align="center" color="#27408B"
    > width="160px" size="2px">
    > <span id="ID" style="display:none">
    > <a href="querdurchd"
    > target="rechts">Quer durch
    > Deutschland</a><br /><hr
    > align="center" color="#1E90FF" width="155px"
    > size="1px">
    > <a
    > href="hornisgrinde.htm"
    > target="rechts">Hornisgrinde</a><br
    > /><hr align="center" color="#1E90FF"
    > width="155px" size="1px">
    > <a
    > href="schwarzwald.htm"
    > target="rechts">Schwarzwald</a><br
    > /><hr align="center" color="#1E90FF"
    > width="155px" size="1px">
    > <a href="bodensee.htm"
    > target="rechts">Bodensee</a><br
    > /><hr align="center" color="#1E90FF"
    > width="155px" size="1px">
    > <a href="idividuell.htm"
    > target="rechts">Individuelle
    > Touren</a></span>
    > <a href="bikewellness.htm"
    > onclick="outline('ID2'); return false;">Bike
    > & Wellness</a><br /><hr
    > align="center" color="#27408B" width="160px"
    > size="2px">
    > <span id="ID2" style="display:none">
    > <a href="bikefamily"
    > target="rechts">Bike &
    > Familie</a><br /><hr
    > align="center" color="#1E90FF" width="155px"
    > size="1px">
    > <a href="wellness.htm"
    > target="rechts">Wellness</a><br
    > /></span>
    > <a href="trainingsplan.htm"
    > target="rechts">Trainingsplan</a><br
    > /><hr align="center" color="#27408B"
    > width="160px" size="2px">
    > <a href="ausrüstung.htm"
    > target="rechts">Ausrüstung</a><br
    > /><hr align="center" color="#27408B"
    > width="160px" size="2px">
    > <a href="packliste.htm"
    > target="rechts">Packliste</a><br
    > /><hr align="center" color="#27408B"
    > width="160px" size="2px">
    > <a href="team.htm"
    > target="rechts">Team</a><br
    > /><hr align="center" color="#27408B"
    > width="160px" size="2px">
    > <a href="bildergalerie.htm"
    > target="rechts">Bildergalerie</a><br
    > /><hr align="center" color="#27408B"
    > width="160px" size="2px">
    > <a href="shop.htm"
    > target="rechts">Online-Shop</a><br
    > /><hr align="center" color="#27408B"
    > width="160px" size="2px">
    > <a href="partner.htm"
    > target="rechts">Unsere Partner</a><br
    > /><hr align="center" color="#27408B"
    > width="160px" size="2px">
    > <a href="Kontakt"
    > target="rechts">Kontakt</a><br
    > /><hr align="center" color="#27408B"
    > width="160px" size="2px">
    > <a href="AGB.htm"
    > target="rechts">AGB</a><br
    > /><hr align="center" color="#27408B"
    > width="160px" size="2px">
    > <a href="impressum.htm"
    > target="rechts">Impressum</a><br
    > /></div>
    >
    > </body>
    >
    > </html>

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!