• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Kleines Navigationsmenü Problem

ryux

Neues Mitglied
Hallo Leute,

es geht um diesen Code

Code:
[COLOR=#000080]<html>[/COLOR] [COLOR=#000080]<head>[/COLOR]  <html>
<head>
<script type="text/javascript">
function menu(activatorId, subMenuId) {
  var active = false;
  var activator = document.getElementById(activatorId);
  var subMenu = document.getElementById(subMenuId);
  
  
  // Untermenü wirklich unsichtbar machen
  subMenu.style.display = "none";
  
  
  
  this.switchMenu = function() {
    if(active) closeMenu();
    else openMenu();
    return false;
  };
  
  var closeMenu = function() {
    subMenu.style.display = "none";
    active = false;
  };
 
  var openMenu = function() {
    subMenu.style.display = "block";
    active = true;
  };
  // Eventhandling
  activator.onclick = this.switchMenu;
  
  
}
</script>
<style type="text/css">
li {
    list-style-type: none;
}
#hauptnavi1 {
    padding: 0px;
    margin-top: 50px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    height: 25px;
}
#menu1 {
    clear: right;
    float: left;
}
#submenu1 {
    padding-left: 100px;
}
#submenu1 li {
    display: inline;
    margin-left: 10px;
}
#hauptnavi2 {
    padding: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    height: 25px;
}
#menu2 {
    clear: right;
    float: left;
}
#submenu2 {
    padding-left: 100px;
}
#submenu2 li {
    display: inline;
    margin-left: 10px;
}
</style>
</head>
<body>
<div id="hauptnavi1">
  <ul>
    <li> <a href="#" id="menu1">WORK</a>
      <ul id="submenu1">
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
        <li><a href="#">4</a></li>
        <li><a href="#">5</a></li>
        <li><a href="#">6</a></li>
      </ul>
    </li>
  </ul>
</div>
<div id="hauptnavi2">
  <ul>
    <li> <a href="#" id="menu2">ABOUT</a>
      <ul id="submenu2">
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
        <li><a href="#">4</a></li>
      </ul>
    </li>
  </ul>
</div>
</body>
<script type="text/javascript">
  new menu("menu1","submenu1");
  new menu("menu2","submenu2");
</script>
</html>


Das Problem ist, das wenn ich Menü 1 also Work anklicke, öffnet sich das submenu1 (bis hierhin ist alles bestens), aber wenn ich Menü 2 also About anklicke und sich das submenu2 öffnet schließt sich submenu 1 nicht.

Könnt ihr mir bitte weiter helfen?

Also, ich will das wenn Menü 1 gedrückt wird und dann Menü 2 das dann das submenu von Menü 1 schließt und natürlich soll es auch umgekehrt funktionieren.

Das Navimenü hab ich hier in Forum gefunden, danke nochmal an den Verfasser.
 
Das geht auch nicht mit diesem JavaScript. Bist Du aber sicher, dass Du von "klicken" sprichst? Solche Aufklappmenüs kann man auch prima ohne JavaScript schreiben, nur eben dann per hover-Pseudoklasse, ein Klick auf Menüpunkte um Untermenüpunkte zu öffnen wäre nicht notwendig. Falls Du wirklich Klicken meinst, dann wärst Du im CSS-Bereich hier falsch.
 
hallö,

als erstes valide machen gerade bei js wichtig. zb doctype fehlt.
wo ist der link zur Seite?
was sagt fehlerkonsole?
und wie schon gesagt falschen unterfotum.

cheffchen
 
Ich vermute mal, es liegt daran, dass von dem Konstruktor zwei Instanzen erzeugt werden, die beide unabhängig voneinander sind:

Code:
new menu("menu1","submenu1");
new menu("menu2","submenu2");

Menüpunkt 1 "weiss" nichts von Menüpunkt - und umgekehrt.

Und bevor du jetzt fragst, ob dir jemand das Script anpasst: Nein, dazu müsstest du schon einen eigenen Ansatz liefern. Nur copy & paste geht nicht. Außerdem lässt sich so etwas auch weniger umständlich realisieren.
 
Hallo, danke erst mal für die zahlreiche antworten.

Also, ich bin jetzt kein super Webdesigner, ich habe HTML und CSS allein und ohne jegliche Hilfe gelernt, nur mit Videos und Lesen. Javascript kann ich gar nicht und habe auch irgendwann vor es zu lernen, wenn ich mal mehr Zeit haben sollte. Ich bin also nur ein Hobbywebdesigner der einen Freund einen gefallen tut.

Jetzt zu den Fragen:

-Eine Webadresse gib es noch keine.

-Es gibt in meinem Code kein Doctype, weil die Seite soweit fertig ist und es nur noch mit den navimenü Probleme gibt und diese ist in einer anderen HTLM-Datei,
weil ich nicht wollte das die Seite wegen des Navimenüs versaut wird, solang sie nicht Einwandfall funktioniert.

-Ja, mein Freund will unbedingt ein klick Menü (leider kein Hovermenü, was viel einfacher wäre), es soll so wie auf dieser Seite werden (Gallery und About).
Die Seite ist mit CMS (TYPO3) geschrieben.

-Das Menü habe ich auf diesem Forum gefunden und habe es an meine Bedürfnisse angepasst. Bis auf das Problem mit dem Klick ist alles bestens.

-Ich weiß nicht ob es ein CSS oder ein Javascript Problem ist, ich habe viele Stunden versucht das Problem selber zu lösen (was immer bis jetzt geklappt hat)
aber bei diesen Spezialenfall brauche ich bitte dringen eure Hilfe.

Wenn das Problem ein Javascript Problem sein sollte, bitte ich den Admins dieses Thema ins Javascriptbereiches zu verschieben und entschuldige mich das ich ins falsche Bereich gepostet habe.

mfg
 
Zuletzt bearbeitet:
Zurück
Oben