✔ Animiertes Menü

Status
Nicht offen für weitere Antworten.
re: Animiertes Menü

Dann tausche einfach wieder den onmouseover-Eventhandler gegen den onclick-Eventhandler aus.
 
re: Animiertes Menü

Ok, da hätte ich auch selber drauf kommen können.

Ein weiteres Problem hat sich mir nun aufgetan:

Wenn ich das Menü das erste Mal öffne, soll die Kategorie Aktuelles offen sein und der Unterpunkt News aktiv sein. Momentan wird die Kategorie Aktuelles erst Rot, wenn ich eine andere Kategorie anklicke und dann ein zweites mal auf Aktuelles klicke.
Wo liegt das Problem?

Link: http://www.csc-hollen.de/ftc/menutest.htm

Gruß
Moleman

Edit: Und das Menü sieht im IE nicht sehr schön aus. Kann man da auch noch was gegen tun?
 
Zuletzt bearbeitet:
re: Animiertes Menü

Moleman hat gesagt.:
Ein weiteres Problem hat sich mir nun aufgetan:

Wenn ich das Menü das erste Mal öffne, soll die Kategorie Aktuelles offen sein und der Unterpunkt News aktiv sein. Momentan wird die Kategorie Aktuelles erst Rot, wenn ich eine andere Kategorie anklicke und dann ein zweites mal auf Aktuelles klicke.
Wo liegt das Problem?
Zum Vergrößern anklicken....
Ich zitiere dann mal Quaese:

Quaese hat gesagt.:
Damit kannst Du nun beim Seitenaufruf im onload-Event angeben, welcher Menüpunkt aktiv sein soll (im Bsp. Punkt drei).
Zum Vergrößern anklicken....
Und praktisch sieht das dann so aus:

Code: 
<body onload="show('subnav1');">
<div id="navcontainer">
     <ul id="navlist">
         <li id="active"><a href="#" onclick="show('subnav1');getLink('subnav1');" id="current" onmouseover="">Aktuelles</a>

             <ul id="subnav1" style="display:none;">
                 <li id="subactive"><a href="#" id="subcurrent">News</a></li>
                 <li><a href="#">Termine</a></li>
                 <li><a href="#">FTC Huus</a></li>
             </ul>
         </li>
         <li><a href="#" onclick="show('subnav2');">Fussball</a>

                <ul id="subnav2" style="display:none;">
                    <li><a href="#">I.Herren</a></li>
                    <li><a href="#">II.Herren</a></li>
                    <li><a href="#">A-Jgd</a></li>
                    <li><a href="#">B-Jgd</a></li>
                    <li><a href="#">C-Jgd</a></li>

                    <li><a href="#">D-Jgd</a></li>
                    <li><a href="#">E-Jgd</a></li>
                    <li><a href="#">F-Jgd</a></li>
                    <li><a href="#">G-Jgd</a></li>
                </ul>
         </li>
                  <li><a href="#" onclick="show('subnav3');">Volleyball</a>

                <ul id="subnav3" style="display:none;">
                    <li><a href="#">I.Damen</a></li>
                    <li><a href="#">A-Jgd</a></li>
                    <li><a href="#">B-Jgd</a></li>
                    <li><a href="#">C-Jgd</a></li>
                </ul>
         </li>

                 <li><a href="#" onclick="show('subnav4');">Tennis</a>
                <ul id="subnav4" style="display:none;">
                    <li><a href="#">Mitglieder</a></li>
                    <li><a href="#">Gelände</a></li>
                    <li><a href="#">Trainingszeiten</a></li>
                </ul>
         </li>

                 <li><a href="#" onclick="show('subnav5');">Gymnastik</a>
                <ul id="subnav5" style="display:none;">
                    <li><a href="#">Dienstag</a></li>
                    <li><a href="#">Mittwoch</a></li>
                </ul>
         </li>
                 <li><a href="#" onclick="show('subnav6');">Community</a>

                <ul id="subnav6" style="display:none;">
                    <li><a href="#">Gästebuch</a></li>
                    <li><a href="#">Forum</a></li>
                    <li><a href="#">Chat</a></li>
                </ul>
         </li>
                 <li><a href="#" onclick="show('subnav7');">Impressum</a>

                <ul id="subnav7" style="display:none;">
                    <li><a href="#">Disclaimer</a></li>
                    <li><a href="#">Kontakt</a></li>
                </ul>
         </li>
     </ul>
</div>
Zudem solltest du den Code deiner menu.js mit dem Script von Quaese vergleichen ;)

Moleman hat gesagt.:
Edit: Und das Menü sieht im IE nicht sehr schön aus. Kann man da auch noch was gegen tun?
Zum Vergrößern anklicken....
Wenn du die Lücken zwischen den Submenü-Links meinst:

Code: 
#navcontainer ul ul a,
#navcontainer ul ul a:link,
#navcontainer ul ul a:visited
{
background-color:#990000;
color: #FFFFFF;
display: block;
float: left;
margin: 0;
}
 
Hallo,
so ich habe das Menü nun soweit hinbekommen.
Allerdings habe ich da noch ein Problem.
Wenn ihr euch das Menü anschaut:

http://www.csc-hollen.de/ftc/menu.htm

seht ihr das nur der untere Balken sich der Breite mit 100% anpasst.
Der obere Balken mit dem Hintergrundbild ist nicht größer als der lezte Menüpunkt.
Und ich möchte nun gerne, dass der Balken oben auch durchgängig bis zum Ende geht.

Wie bekomme ich das hin?

gruß
moleman
 
Setze mal das Hintergrundbild anstelle für #navcontainer ul im Selektor #navcontainer ein.
 
Ok, danke hat geklappt.

Nun noch eine letzte Frage, dann sollte es endlich genug sein.

Und zwar wollte ich gerne, dass die Unterpunkte eines Menüpunktes nicht linksbündig angezeigt werden, sondern anfangen unter dem jeweiligen Oberpunkt aufgelistet zu werden.

Wenn ich über den Menüpunkt Aktuelles gehe, soll das Untermenü so aussehen:

http://www.csc-hollen.de/ftc/menu1.JPG

Und wenn ich dann über den Menüpunkt Fusball gehe, soll das Untermenü so aussehen:

http://www.csc-hollen.de/ftc/menu2.JPG

Gruß
Moleman
 
Hierfür wirst du das Menü von Grund auf restruktruieren müssen, um die Submenüs unterhalb der Hauptmenüpunkte positionieren zu können.

Die Hauptlinks benötigen dann eine fixe Breitenangabe, um so für das dazugehörige Submenü die entsprechende linke Position bestimmen zu können.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück