• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Selbsteinblendende Menüleiste

K

KV3000

New member
Hi,

Ich möchte meine HP mit einem Menü ausstatten, bei dem bei einem Klick auf ein Thema die betreffenden Unterthemen in der Menüleiste angezeigt werden. Ich hab keine Ahnung, wie so eine Leiste im Fachausdruck heißt; So hab ich sie kurzerhand "Selbsteinblendende Menüleiste" getauft. Am besten, wäre eine fix und fertige Vorlage...

btw: Kann man solche Menüleisten mit Frontpage oder Dreamweaver erstellen?
 
Meinst du sowas?

Code: 
<html>
<head>
  <style type="text/css">
    ul, li {
      margin: 0; 
      padding: 0;
    }

    li {
      list-style-type: none;
    }

    li ul {
      display: none;
    }
  </style>

  <script type="text/javascript">
    function toggleNavi(sender) {
      var parent = sender.parentNode;
      var subMenu = parent.getElementsByTagName('UL')[0];
      if(subMenu.style.display == 'block') {
        subMenu.style.display = 'none';
      } else {
        subMenu.style.display = 'block';
      }
    }
  </script>
</head>
<body>
  <ul>
    <li>
      <a href="#" onclick="toggleNavi(this); return false;">Navipunkt 1</a>
      <ul>
        <li>Unternavi 1</li>
        <li>Unternavi 2</li>
        <li>Unternavi 3</li>
      </ul>
    </li>
    <li>
      <a href="#" onclick="toggleNavi(this); return false;">Navipunkt 2</a>
      <ul>
        <li>Unternavi 1</li>
        <li>Unternavi 2</li>
        <li>Unternavi 3</li>
      </ul>
    </li>
    <li>
      <a href="#" onclick="toggleNavi(this); return false;">Navipunkt 3</a>
      <ul>
        <li>Unternavi 1</li>
        <li>Unternavi 2</li>
        <li>Unternavi 3</li>
      </ul>
    </li>
    <li>
      <a href="#" onclick="toggleNavi(this); return false;">Navipunkt 4</a>
      <ul>
        <li>Unternavi 1</li>
        <li>Unternavi 2</li>
        <li>Unternavi 3</li>
      </ul>
    </li>
  </ul>
</body>
</html>

Ich kann mir vorstellen, dass es sowas auch im Dreamweaver unter den vorgefertigten Skripten gibt, aber ich weiß es nicht sicher.
 
Ja, genau das mein ich!
Es fehlt nur noch, dass die Unterthemen automatisch wieder ausgeblendet werden, sobald ich ein anderes Thema anklick. Ich werd mal den Dreamweaver installieren und schauen, obs da was gibt.

Was meinst du: Ist es zu kitschig, wenn ich den Text bei einem mouseover auch noch hervorhebe?


Ach Harry, was würd ich nur ohne dich machen :rolleyes:


PS: Wieviel verdient man eigenlich als Dauerposter? :D :) :grin:
 
1) Das hast du

Code: 
<html>
<head>
  <style type="text/css">
    ul, li {
      margin: 0; 
      padding: 0;
    }

    li {
      list-style-type: none;
    }

    li ul {
      display: none;
    }
  </style>

  <script type="text/javascript">
    var lastExpanded = false;

    function toggleNavi(sender) {
      if(lastExpanded) {
        lastExpanded.style.display = 'none';     
      }
      var parent = sender.parentNode;
      var subMenu = parent.getElementsByTagName('UL')[0];
      if(subMenu.style.display == 'block') {
        subMenu.style.display = 'none';     
        lastExpanded = false;
      } else {
        subMenu.style.display = 'block';
        lastExpanded = subMenu;
      }
    }
  </script>
</head>
<body>
  <ul>
    <li>
      <a href="#" onclick="toggleNavi(this); return false;">Navipunkt 1</a>
      <ul>
        <li>Unternavi 1</li>
        <li>Unternavi 2</li>
        <li>Unternavi 3</li>
      </ul>
    </li>
    <li>
      <a href="#" onclick="toggleNavi(this); return false;">Navipunkt 2</a>
      <ul>
        <li>Unternavi 1</li>
        <li>Unternavi 2</li>
        <li>Unternavi 3</li>
      </ul>
    </li>
    <li>
      <a href="#" onclick="toggleNavi(this); return false;">Navipunkt 3</a>
      <ul>
        <li>Unternavi 1</li>
        <li>Unternavi 2</li>
        <li>Unternavi 3</li>
      </ul>
    </li>
    <li>
      <a href="#" onclick="toggleNavi(this); return false;">Navipunkt 4</a>
      <ul>
        <li>Unternavi 1</li>
        <li>Unternavi 2</li>
        <li>Unternavi 3</li>
      </ul>
    </li>
  </ul>
</body>
</html>

2) Nö, das ist nicht zu kitschig
3) Weiß nicht, was du ohne mich machen würdest. Vermutlich den pit-r Fragen, was du ohne ihn machen würdest :D
4) Als Dauerposter wird man mit Dankbarkeit bezahlt :D Je nach "Kunde" variiert die Bezahlung von sehr gut bis sehr mäßig und manchmal legt man sogar was drauf :p
 
THX, werd dann mal im Laufe der Zeit meine HP umdesignen.

Sag mal Harry, hast du auch eine HP oder eine von dir gestaltete Page? :neugierig:

Beim dritten hast du vermutlich recht *ggg* aber nachdem du ja am schnellsten mit dem posten warst... :D
 
Gern geschehen. :D

Ich habe keine private Website (ich hab zwar meinen Namen als Domain, aber da gibt's nichts zu sehen.)
Ansonsten habe ich schon an vielen Webseiten gearbeitet (das bringt der Web-Programmierer Beruf so mit sich :p), allerdings selten als Designer sondern mehr als Programmierer. Ich hoffe du verstehst, dass ich die ganzen Kundenseiten jetzt hier nicht aufliste.
 
Schade, ich hab mich schon auf eine perfekte gestylte Seite zum Ideen sammeln gefreut ;)
Jo, das mit der Geheimhaltung kann ich gut verstehen; ist fast bei jeder größeren Firma so.

Im Dreamweaver gibts leider keine Vorlagen für animierte Menüleisten; aber das ist Nebensache, schließlich hab ich ja deine Beispiele :).
Ich hab jetzt einen virtuellen Webserver installiert, damit ich meine HP auch offline testen kann.


Mit der Menüleiste hab ich noch ein kleines Problem:
Die Unterpunkte im Menü werden wieder ausgeblendet, sobald man auf einen Link klickt. Es wäre besser, wenn diese Unterpunkte angezeigt werden, damit der Besucher sofort weiß, wo er sich befindet.


PS: Kennst du ein freeware prog, mit dem man Buttons erstellen kann.
 
also wenn du mit DW arbeiten willste kannset das auch mit FW machen :p
ich habe mein (popup) menu mit Fireworks gemacht sieht sogar (finde cih)
chique aus
is sogar sehr einfach :
bild malen
hotspot rauf
rechtsklick popupmenu einfügen
fertig dann kann man den popup rumsieben wie man will is eigentlich ne tolle sache
mit dw hab ichs auch mal (irgentwie) hinbekommen war aber mehr verwirrend als alles andere

will keine werbung machen aber ich bin ein fürsprecher für mmprodukte :p
 
Ich werd Firworks mal unter die Lupe nehmen. Danke für den Tipp! :)
Verrat doch mal die Adresse deiner HP!

Ich hab jetzt das Menü mal mit dem Texteditor geschrieben (ohne Buttons).
Dabei bin ich draufgekommen, dass alle Seiten nicht gehen, die eine Zahl im Dateinamen haben.
Das liegt vermutlich an dem PHP-Code. :rolleyes:
 
Hallo,

gibts bei diesem Menü auch die Möglichkeit zu sagen, dass bestimmte Menüpunkte bereits beim laden der Seite ausgefahren sind?

Volle
 
Moin!

Gib den anchor-Tags ids (Beispiel: id="lnk1" bis id="lnk4"). Um dann die Unterpunkte von Navipunkt 3 beim Laden der Seite aufzuklappen kannste dann Deinen öffnenden body-Tag so umfrickeln:
<body onload="toggleNavi(document.getElementById('lnk3'))">

Ahoi - Pit
 
Hallo,

danke für die Hilfe, klappt wunderbar! Und das Menü schaut auch irgendwie besser aus wenn nicht alles zugeklappt ist.

Volle
 
Hi,

Was ist bitte ein anchor-Tag?


<body onload="toggleNavi(document.getElementById('lnk3'))">
Wenn ich das richtig verstanden habe, dann bau ich diesen Teil in die Seite ein, die von dem Link aufgerufen wird, oder?
 
Moin!
KV3000 schrieb:
Was ist bitte ein anchor-Tag?
Zum Vergrößern anklicken....
In Deinem Fall z. B. das hier:

<a href="#" onclick="toggleNavi(this); return false;">Navipunkt 1</a>

Den Rest hast Du, glaube ich, verstanden...

Gruß - Pit
 
Bei mir geht da gar nix :confused:

Ich hab es so probiert:
<a href="#" id="lnk1" onclick="toggleNavi(this); return false;">Navipunkt 1</a>
 
Hi,

geht es eigentlich auch, dass sich bei einem Klick auf einen Navipunkt nicht nur die Unternavipunkte öffenen, sondern auch eine Seite geladen wird ?

:rolleyes:
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben