Ergebnis 1 bis 3 von 3

Thema: Navigationsleiste

  1. #1
    devilduck
    Gast

    Standard Navigationsleiste

    Hallo

    Ich weis nicht ob das hier das richtige Forum ist für meine Frage aber ich versuch es einfach mal.

    Ich bin dabei mir eine Navigationsleiste zu basteln in der der jeweilige Link solange eine andere Farbe hat bis ich einen neuen Link anklicke. Da es sich um ein Menu mit mehreren Untermenus handelt möchte ich auch das immer nur das Hauptmenu seine Untermenus anzeigt welches gerade aktiv ist.

    Mein Problem ist nun, das es zwar funktioniert das der Hauptmenulink immer eine andere Farbe hat als die nicht aktiven Links.
    Jedoch möchte ich das auch die Untermenulinks eine andere Farbe haben wenn sie aktiv sind und so lange bleiben bis ich einen anderen Link anklicke.

    Um das ganze etwas besser darstellen zu können hier nun der HTML Code wie ich ihn bislang habe.


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Verzeichnisse</title>

    <style type="text/css">

    .menu { text-decoration: none;}

    .sub { display: none;text-decoration: none;}

    div#menuLayer { width: 10em; margin: 0; padding: 0.8em;}

    * html div#menuLayer { /* Korrekturen fuer IE 5.x */ width: 11.6em; w\idth: 10em; padding-left: 0; padd\ing-left: 0.8em;}

    div#menuLayer li { list-style: none; margin: 0.4em; padding: 0;}

    div#menuLayer li ul { margin: 0 0 0 1em; padding: 0;}

    div#menuLayer li ul li { margin: 0.1em 0;}

    * html div#menuLayer li ul li { /* Korrektur fuer IE 5.x */ margin-left: 1em; ma\rgin-left: 0;}

    * html div#menuLayer a { width: 100%; /* Breitenangabe fuer IE 5.x */ w\idth: 8.8em; /* Breitenangabe fuer IE 6 */}

    * html div#menuLayer li ul li a { width: 100%; /* Breitenangabe fuer IE 5.x */ w\idth: 7.8em; /* Breitenangabe fuer IE 6 */}

    div#menuLayer a { display:block; padding: 0.2em; text-decoration: none; font-weight: bold; border: 1px solid black;
    border-left-color: white; border-top-color: white; color: #000000;}

    div#menuLayer a:link { border: 1px solid black; border-left-color: white; border-top-color: white;}

    div#menuLayer a:visited { border: 1px solid black; border-left-color: white; border-top-color: white;}

    div#menuLayer a:hover { border-color: white; border-left-color: black; border-top-color: black; color: white;
    background-color: #FF0000;}

    div#menuLayer a:active { border-color: white; border-left-color: black; border-top-color: black; color: white; background-color: #FF0000;}


    </style>
    <script language="JavaScript1.2">
    function doMenu(id, display)
    {

    if(id == 'menu1sub' && display == 'block')
    { document.getElementById('menu_link1').style.backgr oundColor = "red";
    document.getElementById('menu_link2').style.backgr oundColor = "";
    }

    if(id == 'menu2sub' && display == 'block')
    { document.getElementById('menu_link2').style.backgr oundColor = "red";
    document.getElementById('menu_link1').style.backgr oundColor = "";
    }


    document.getElementById(id).style.display = display;
    }

    </script>

    </head>
    <body>
    <div id="menuLayer">
    <b id="menu1" style=";cursor:hand;">
    <a href="#" id="menu_link1" onmouseup="doMenu('menu1sub','block');doMenu('menu 2sub','none');">
    <div class="menu"><font size="4">Verzeichnis 1</font></div></a> [/b]
    <div id="menu1sub" class="sub">
    </div>




    <b id="menu2">
    <a href="#" id="menu_link2" onmouseup="doMenu('menu2sub','block');doMenu('menu 1sub','none');">
    <div class="menu"><font size="4">Verzeichnis 2</font></div></a> [/b]
    <div id="menu2sub" class="sub">
    [*]<font size="3" face="Arial, Helvetica, sans-serif, font-size 8pt">Unterverzeichnis 2.1</font>
    [*]<font size="3" face="Arial, Helvetica, sans-serif, font-size 8pt">Unterverzeichnis 2.2</font>
    [*]<font size="3" face="Arial, Helvetica, sans-serif, font-size 8pt">Unterverzeichnis 2.3</font>
    </div>

    </div>
    </body>
    </html>

    Vielen Dank schon mal für Eure mühen

    devilduck

    Ps.: Entschuldigung das ich hier gleich einen so langen post als meine ersten reinstelle. Ich hoffe das das kein Problem ist. Danke.
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    König(in) Avatar von yeti66
    Registriert seit
    21.10.2005
    Ort
    Harz
    Alter
    51
    Beiträge
    1.152
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Hi,
    Ich würde sagen unter :
    www.css.maxdesign.com.au/listamatic/
    und
    www.css-menue.de
    findest Du schon das richtige für Dich.
    An Deine Bedürfnisse musst Du es schon selber anpassen.

    Gruß yeti66

    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    www.staettner.de
    www.harz-achat.de
    www.harzurlauber.de
    Gruß yeti66
    ___________________________________________
    http://www.phpcontact.net/ Kontaktformulare für die eigene Hompage
    http://www.norbert-klippstein.de Freiberuflicher Musiker für individuelle Musikdienstleistungen

  3. #3
    König(in) Avatar von yeti66
    Registriert seit
    21.10.2005
    Ort
    Harz
    Alter
    51
    Beiträge
    1.152
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Hi devilduck,
    hier noch einfacher als reines css-menü

    Gruß yeti66
    Angehängte Dateien Angehängte Dateien
    Gruß yeti66
    ___________________________________________
    http://www.phpcontact.net/ Kontaktformulare für die eigene Hompage
    http://www.norbert-klippstein.de Freiberuflicher Musiker für individuelle Musikdienstleistungen

Ähnliche Themen

  1. Navigationsleiste
    Von micki im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 09.12.2006, 15:07
  2. Navigationsleiste, etc.
    Von Monamo im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 07.09.2006, 12:02
  3. Navigationsleiste
    Von Marcelund im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 08.02.2006, 14:16
  4. Navigationsleiste
    Von Ragon016 im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 21.08.2005, 13:29
  5. Navigationsleiste
    Von takke im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 04.02.2005, 11:52

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •