2 Navileisten

[bibifellow]

Hallo, ich habe zwei Navileisten erstellt die zweite soll erst beim Klicken auf Galerie sichtbar werden. Ist dies möglich??

<div id="navibereich">
 <div id="navibereich_innen">
<ul>
<li ><a href="index.php?seite=home" 
class="<?php echo ($_GET['seite'] == 'home') ? 'current': 'normal'; ?>"
 tabindex="1" >Pinnocchio</a></li>
  
  <li
 <li> <a href="index.php?seite=impressum" 
class="<?php echo ($_GET['seite'] == 'impressum') ? 'current': 'normal'; ?>" 
tabindex="1">Impressum</a></li>
<li> <a href="index.php?seite=Galerie" 
class="<?php echo ($_GET['seite'] == 'anfahrt') ? 'current': 'normal'; ?>" 
tabindex="1">Anfahrt</a></li><ul>
   <div id="navibereich1">
 <div id="navibereich_innen1">
 <ul> 
      <li> <a href="index.php?seite=kleinundfein"  
      class="<?php echo ($_GET['seite'] == 'kleinundfein') ? 'current': 'normal'; ?>" tabindex="1">klein und fein</a></li>
      
      <li > <a href="index.php?seite=toskana" 
      class="<?php echo ($_GET['seite'] == 'toskana') ? 'current': 'normal'; ?>" tabindex="1">Toskana</a></li>
      
      <li > <a href="index.php?seite=acryl"
      class="<?php echo ($_GET['seite'] == 'acryl') ? 'current': 'normal'; ?>" tabindex="1" >Acryl</a></li>
      
      <li > <a href="index.php?seite=Bleistift" 
      class="<?php echo ($_GET['seite'] == 'bleistift') ? 'current': 'normal'; ?>" tabindex="1">Bleistift</a></li>
      
      <li > <a href="index.php?seite=aquarell" 
      class="<?php echo ($_GET['seite'] == 'aquarell') ? 'current': 'normal'; ?>" tabindex="1">Aquarell</a></li>
      
       <li > <a href="index.php?seite=foto" 
       class="<?php echo ($_GET['seite'] == 'foto') ? 'current': 'normal'; ?>" tabindex="1">Foto</a></li>
       
                          </ul>
 </div> <!-- Ende Navibereich innen -->
 </div> <!-- Ende Navibereich -->
 </div> <!-- Ende Navibereich innen -->
 </div> <!-- Ende Navibereich -->

Die zweite Navigation soll nur beim Klicken auf Galerie sichtbar werden.
css

div#navibereich { 
  overflow: hidden; 
  text-align: right;  
  padding: 5px 20px 42px 20px; 
  margin-top:50px;
 
}
* html #navibereich { height: 1%; }
  div#navibereich ul { 
   list-style-type:none;
    width: auto; 
    margin-bottom: 0;
 margin-top:35px; 
  }
  div#navibereich li { 
    float:right; 
    width: auto;       
    list-style-type: none;
    margin: 0;
    margin-right: 5px;  
 margin-bottom:0;   
  }
  div#navibereich a {
     
    color: #fff0cf;
    padding: 4px 25px 4px 25px; 
  font-family: "#fff0cf";
  font-size:16px;
  }
  div#navibereich li a.sie-sind-hier { 
    color: black; 
    background-color: white; 
    border-bottom-color: white; 
   } 
  div#navibereich a:hover,
  div#navibereich a:focus { 
    color: black; 
    background-color: white; 
    border-bottom-color: white;
  } 
  div#navibereich a:active { 
    color: black; 
    background-color: white; 
    border-bottom-color: white; 
  }
  
  
  /*--------------------------------------------------------------*/
   div#navibereich1 ul { 
   list-style-type:none;
    float: right; 
    width: auto; 
    margin-bottom: 0; 
  }
  div#navibereich1 li { 
 margin-top:0;
    float:right; 
    width: auto;       
    list-style-type: none;
    margin: 0;
    margin-right: 1px;     
  }
  div#navibereich1 a {
   border-right:1px solid #fff0cf;;
 color: #fff0cf;
 padding: 4px 8px 4px 8px;
 font-family: "#fff0cf";
 font-size: 12px;
  }
  div#navibereich1 li a.sie-sind-hier { 
    color: black; 
    background-color: white; 
    border-bottom-color: white; 
   } 
  div#navibereich1 a:hover,
  div#navibereich1 a:focus { 
    color: black; 
    background-color: white; 
    border-bottom-color: white;
  } 
  div#navibereich1 a:active { 
    color: black; 
    background-color: white; 
    border-bottom-color: white; 
  }

css

 

[cebito]

AW: 2 Navileisten

Deinen PHP/WP/HTML-Mix wird niemand nachbauen wollen, linke bitte zum Problem und erkläre genau, welche Navi bei Klick auf welche sichtbar werden soll. Aus den Schnipseln lässt sich nicht erkennen, was du eigentlich bezwecken möchtest.

 

[bibifellow]

AW: 2 Navileisten

bei klicken auf

<li> <a href="index.php?seite=Galerie" 
class="<?php echo ($_GET['seite'] == 'anfahrt') ? 'current': 'normal'; ?>" 
tabindex="1">Galerie</a></li>

soll die darunter liegende Navileiste ( beide sind horizontal) mit klein und fein, Toskana, Acryl, Bleistift, Aquarell und Foto sichtbar werden.
Ist das überhaupt möglich??

 

[Myhar]

AW: 2 Navileisten

Dafür ist deine HTML Strukutur zur Zeit nicht geeignet. Baue die zuerst auf eine verschachtelte Liste um. Auch ist die Klasse "normal" redundant und kann entfernt werden. Eine Kennzeichnung des aktuellen Menüs reicht aus.
Ein Tutorial, welches dir bei deinem Vorhaben behilflich sein kann. Hier wird nicht mit Klick, sondern mit Mouseover gearbeitet, was ich aber auch besser finde, da die meisten Seiten so funktionieren und du komplett ohne JS arbeiten kannst. Möchtest du unbedingt einen Klick haben, dann musst du natürlich noch JS hinzufügen.

 

[bibifellow]

AW: 2 Navileisten

Ich habe noch ein bisschen gegoogelt es soll so aussehen
Home Galerie Impressum


Toskana Acryl Bleistift Aquarell Foto

Beim Klick auf Galerie soll die Leiste darunter sichtbar werden.

Würde das auch mit einer Infobox gehen??

Verzweifel schon weil ich keine Lösung finde....

 

[Myhar]

AW: 2 Navileisten

Wieso muss es unbedingt bei Klick sein? Das erfodert doch nur unnötiges Javascript. Dann würde mein Link dir doch weiterhelfen, du kannst das submenü ja nach deinen Vorstellungen stylen und natürlich auch vertikal erscheinen lassen.
Und was soll eine Infobox sein?

 

[bibifellow]

AW: 2 Navileisten

Habe es jetzt mit Javascript gelöst. Leider habe ich unter den Menüpunkten im Firefox kleine rote Punkte. Habe schon in der Navigation css für li a und ul

 list-style-type:none;

aber es bleibt trotzdem. Woran könnte das liegen.

 

[bibifellow]

nur im firefox rote Punkter unter der Navigation

Hallo, ich habe eine Navigation erstellt und nur im Firefox und Safari habe ich eine Linie von roten Punkten unter der Navigation obwohl ich

list-style-type:none;

ich habe auch schon

outline: None;

versucht. Gäbe es noch eine andere Lösung.

Habe an dieser Stelle mal die beiden Threads zusammengefügt. Da es immer noch um die selbe Navi geht brauchst du keine 2 Threads. (simonpicos - mod)

 

[rafoldi]

AW: nur im firefox rote Punkter unter der Navigation

Hallo Verstehe Dein Problem noch nicht ganz, vermute zwar das eine oder andere. Kannst Du ein kleines Bild hoch laden? Oder mehr Code?
Eventuell ist im CSS Code auch noch mehr Versteckt? An der Stelle die Du geschildert hast könnte in der Struktur noch ein Widerspruch vorhanden sein.

 

[bibifellow]

AW: nur im firefox rote Punkter unter der Navigation

Und das ist nur bei der 2. Navi die ich mit JavaScript eingebunden habe um Tabellen einzubinden.

meine css sieht so aus

ul.navi {
             list-style: none;
             margin: 0;
             padding: 0;
  position:fixed;
      list-style-type:none;
     }
 ul.navi li {
             display: inline;
   list-style-type:none;
 outline:none;
 
 }
 ul.navi li a {
             padding: 3px 5px;
             color: #000;
             text-decoration: none;
    font-family:Arial, Helvetica, sans-serif;
 font-size: 10px;
 outline:none;
 }
 ul.navi li a.selected,  ul.navi li a:hover {
 background-color:#c4b36e;
 color: #fff;
 
 }
 ul.navi li a:focus {
             outline: 0;
 }

die navi normal

<div class="tabs">
   <ul class="navi">
     <li><a href="#eins">Home</a></li>
     <li><a href="#zwei">Toskana</a></li>
     <li><a href="#drei">Acryl</a></li>
     <li><a href="#vier">Bleistift</a></li>
          <li><a href="#fuenf">Aquarell</a></li>
          <li><a href="#sechs">Foto</a></li>
          <li><a href="#sieben">Impressum</a></li>
   </ul>

hier ein Bild davon
http://www.abload.de/image.php?img=unbenannt-18puf9.jpg

 

[bibifellow]

AW: 2 Navileisten

Habe ich gelöst. Danke für die Hilfe.

 

[rafoldi]

AW: 2 Navileisten

Währe schön wenn Du Deine Lösung uns mitteilen kannst.

 

[bibifellow]

AW: 2 Navileisten

Die includete Seite hat sich ein a:dotted von der Hauptseite hergenommen und diese angezeigt. Habe dann die Hauptseite nach dotted gesucht und bei a: dann border bottom dotted . Dies gelöscht und die Pünktchen waren weg.