Untermenü

[Nathaly]

Hallo Zusammen

wie ist den der Code fürs Untermenü von nicoles-fotoseite .... kann den nirgends finden

[Nathaly]

weiß das keiner der mir den Code benennen kann ?

[moni]

weiß das keiner der mir den Code benennen kann ?

Nicole ...du fragst nach Unterseiten sage Dir du würdest sie auch nicht finden, weil in den Skript Vorlage 11 keine waren moniert .
.dazu hab ich schon mal hier die tage geschrieben wenn du mit deinen Grafiken und wünschen fertig bist da ist erforderlich komplett das Skript neu einstellen und korrigieren müssen !!!!..die Fehler usw sind immer noch drin , von da gesehen da kann man eventuell überlegen ob da welchen unter Seiten rein quetschen möglich wär...
muster 11 und sonst all die anderen Vorlagen sind als fertige vorlagen zum runter laden, und bedacht sind nur kleine Änderungen so wie zum B farblich anpassen , Logo Grafik oder Schrift Art zu ändern unsw ...bestehen aber sonst sehr viele sondern wünsche da ist immer dringend anzuraten einfach einen Design Wunsch hier einzustellen !
Für uns ist das viel einfacher und weniger Arbeit als diese Flickerei ...

[Nathaly]

hab auch schon mit Peter geschrieben

[goefi-chiangmai]

Werde dir ein zusatz in die CSS machen für untermenüs, habe jedoch erst nächste Woche Zeit.
Das Design 11 hat keine weil es eigentlich nicht braucht, da ja oben 10 Links platz haben und durch die Boxen links und rechts genügend Gruppierungen und Links eingebracht werden können.

Jedoch mach ich da nur Trop down menüs, weil Untermenüs bei dem Design eh nicht gut aussehen

[Nathaly]

Prima ... dir Peter

[goefi-chiangmai]

So erledigt:
Habe Dir ein Drop dawn menü gemacht, alles andere sieht ja bei diesem design nicht gut aus (eigentlich gehören keine Untermenüs da rein).
Da es ja bei nPage einbaust, brauchst die Javascript Datei dazu nicht

Jetzt musst deine CSS Datei ausbauen, habe Dir deine Farben gleich gesetzt:
-----------------
Direckt unter deiner classe:
-------------------------------------------
.navigation a:hover {
color: #fefefe;
background-position:0 bottom;
border-bottom: 1px dashed #fefefe;
}
-------------------------------------

kommt die sub_menu rein hier:

Code: Alles auswählen

a.sub_navigation:link, a.sub_navigation:visited, a.sub_navigation:active {
  display: block;
  width: 130px;
  height: 25px;
  line-height: 25px;
  margin-left: 10px;
  font-family: "Arial Narrow";
  font-size: 15px;
  color: #FFFF99;
  text-align: left;
  text-decoration: none;
  background-color: transparent;
  border-bottom: 1px dashed #000000;
}
a.sub_navigation:hover {
  display: block;
  color: #FEFEFE;
  text-decoration: none;
  background-color: transparent;
}

und im HTML teil: für dein Untermenü ist das hier (musst natürlich anpassen):

Code: Alles auswählen

      <a target="_self" href="javascript:untermenu('untermenu');">Untermenu</a>
    <div id="untermenu" style="display: none">
  <a class="sub_navigation" target="_self" href="index.html">Musterlink 11 A</a>
  <a class="sub_navigation" target="_self" href="index.html">Musterlink 11 B</a>
  <a class="sub_navigation" target="_self" href="index.html">Musterlink 11 C</a>
    </div>

[Nathaly]

habe es so verstanden ...ist das so richtig ?

}
.navigation a:hover {
color: #fefefe;
background-position:0 bottom;
border-bottom: 1px dashed #fefefe;

a.sub_navigation:link, a.sub_navigation:visited, a.sub_navigation:active {
display: block;
width: 130px;
height: 25px;
line-height: 25px;
margin-left: 10px;
font-family: "Arial Narrow";
font-size: 15px;
color: #FFFF99;
text-align: left;
text-decoration: none;
background-color: transparent;
border-bottom: 1px dashed #000000;
}

a.sub_navigation:hover {
display: block;
color: #FEFEFE;
text-decoration: none;
background-color: transparent;
}

und hier der ganze css.style code vorsichtshalber

Code: Alles auswählen

    /*CSS Format by http://npage-hilfe.net*/

    body {
      font-family: Arial Narrow;
      font-size: 16px;
      color: #FFFFFF;
      background-color: #000000;
      background-image: url(../bilder/bg_list_2.png);
      background-repeat: repeat-x;
      background-position: 0 0;
      background-attachment: fixed;
    }
    h1 {
      font-family: "trebuchet ms";
      font-size: 22px;
      color: #FFFF88;
      text-align: center;
      text-decoration: none;
    }
    h2 {
      font-family: "trebuchet ms";
      font-size: 18px;
      color: #FFFF66;
      text-align: center;
    }
    h3 {
      font-family: verdana;
      font-size: 16px;
      color: #FFFF44;
      text-align: center;
    }
    a:link {
      font-family: "Arial Narrow";
      color: #FFFF99;
      font-size: 16px;
      text-decoration: none;
    }
    a:visited {
      color : #FFFF99;
      text-decoration : none;
    }
    a:active {
      color: #FFFF99;
      text-decoration: none;
    }
    a:hover {
      color: #fefefe;
      text-decoration: none;
    }
    a img {
      border: none;
    }
    p {
      margin-top: 16px;
      margin-bottom: 16px;
    }
    textarea {
      color: #FFFF99;
      font-size: 12px;
      font-family: Arial Narrow;
      padding: 3px;
      background-color: #111111;
      border: 1px solid #696969;
      border-radius: 3px;
    }
    #aussen {
      width: 1040px;
      margin-right: auto;
      margin-left: auto;
      background-color: #222222;
      background-image: url(../bilder/bg_aussen.jpg);
      background-repeat: repeat;
      border: 1px solid #696969;
      border-radius: 3px;
      padding: 8px;
    }
    #header {
      width: 1038px;
      background-color: transparent;
      height: 139px;
      border: 1px solid #696969;
      border-radius: 3px;
      background-image: url(../bilder/header2.png);
      background-position: center 0;
    }
    #balken {
      float: left;
      width: 1038px;
      height: 22px;
      color: #FFFFFF;
      text-align: center;
      line-height: 20px;
      margin-top: 10px;
      margin-bottom: 10px;   
      border: 1px solid #696969;
      border-radius: 3px;
      background-color: #222222;
      background-image: url(../bilder/bg_list.png);
      background-repeat: repeat-x;
      background-position: 0 0;
    }
    #navilinks {
      float: left;
      width: 170px;
      color: #343433;
      background-color: transparent;
      padding: 0px;
      margin: 0px;
    }
    #navilinks h1 {
      margin-bottom: 3px;
      margin-top: 10px;
    }
    #navilinks h2 {
      margin-bottom: 2px;
      margin-top: 8px;
    }
    #navilinks h3 {
      margin-bottom: 2px;
      margin-top: 10px;
    }
    .boxlinks {
      float: left;
      width: 160px;
      color: #FFFFFF;
      text-align: center;
      font-size: 16px;
      background-color: #000000;
      background-image: url(../bilder/bg_list.png);
      background-repeat: repeat-x;
      background-position: 0 0;
      border: 1px solid #696969;
      border-radius: 3px;
      padding : 4px;
      margin-bottom: 8px;
    }
    .navigation a {
      display:block;
      width:140px;
      height:25px;
      line-height:25px;
      text-align: left;
      font-size: 16px;
      font-family: "Arial Narrow";
      color: #FFFF99;
      padding-left:18px;
      margin:0px;
      background:url(../bilder/button_navi.png) no-repeat;
      text-decoration:none;
      border-bottom: 1px dashed #696969;
    }
    .navigation a:hover {
      color: #fefefe;
      background-position:0 bottom;
      border-bottom: 1px dashed #fefefe;
    }
    #navirechts {
      float: right;
      width: 170px;
      color: #343433;
      background-color: transparent;
      padding: 0px;
      margin: 0px;
    }
    #navirechts h1 {
      margin-bottom: 3px;
      margin-top: 10px;
    }
    #navirechts h2 {
      margin-bottom: 2px;
      margin-top: 8px;
    }
    #navirechts h3 {
      margin-bottom: 2px;
      margin-top: 10px;
    }
    .boxrechts {
      float: right;
      width: 160px;
      color: #FFFFFF;
      text-align:center;
      font-size: 16px;
      background-color: #000000;
      background-image: url(../bilder/bg_list.png);
      background-repeat: repeat-x;
      background-position: 0 0;
      border: 1px solid #696969;
      border-radius: 3px;
      padding : 4px;
      margin-bottom: 8px;
    }
    #inhalt {
      float: left;
      width: 662px;
      text-align: center;
      background-color: #000000;
      background-image: url(../bilder/bg_list.png);
      background-repeat: repeat-x;
      background-position: 0 0;
      padding: 10px;
      margin-left: 8px;
      border: 1px solid #696969;
      border-radius: 3px;
    }
    .button {
      border: 1px solid #696969;
      color: #FFFF99;
      background: #222222;
      padding: 1px 8px;
      border-radius: 5px;
      cursor: pointer;
      margin-top: 3px;
      margin-left: 10px;
    }
    .button:hover, .button:focus {
      color:#fefefe;
      background-color: rgba(0,0,0,0.4);
    }
    .field_t {
      border: 1px solid #696969;
      color: #000000;
      background: #888888;
      padding: 1px 4px;
      border-radius: 2px;
      cursor: text;
      margin-top: 2px;
      margin-left: 6px;
    }
    #seitenlink {
      height: 25px;
      line-height:20px;
      font-family: "Arial Narrow";
      font-weight: normal;
      font-size: 16px;
      color:#FFFFFF;
      text-align: center;
    }
    a.slink:link, a.slink:visited, a.slink:active {
      font-family: "Arial Narrow";
      font-weight: normal;
      color:#FFFF99;
      font-size:16px;
      text-decoration: none;
    }
    a.slink:hover {
      font-family: "Arial Narrow";
      font-weight: normal;
      color:#fefefe;
      font-size:16px;
      text-decoration: underline;
    }
    #footer {
      float: left;
      width: 1038px;
      height: 22px;
      font-family: Impact;
      font-size: 22px;
      color: #FFFFFF;
      text-align: center;
      line-height: 20px;
      margin-top: 8px;   
      border: 1px solid #696969;
      border-radius: 3px;
      background-color: #222222;
      background-image: url(../bilder/bg_list.png);
      background-repeat: repeat-x;
      background-position: 0 0;
    }
    .copyright {
      font-size: 14px;
      font-family: Impact;
      font-style: normal;
      color: #FFFFFF;
      text-align: center;
    }
    .copyright a {
      font-size: 14px;
      font-family: Impact;
      font-style: normal;
      color: #FFFF99;
      text-decoration: none;
    }
    .copyright a:hover {
      color: #fefefe;
    }
    .clear {
      clear: both;
    }



Zuletzt geändert von goefi-chiangmai am Di 5. Mär 2013, 16:56, insges

[goefi-chiangmai]

Fast, die stelle ist richtig, aber fehlt eine Klammer: "}"

[Nathaly]

}
.navigation a:hover {
color: #fefefe;
background-position:0 bottom;
border-bottom: 1px dashed #fefefe;
}
a.sub_navigation:link, a.sub_navigation:visited, a.sub_navigation:active {
display: block;
width: 130px;
height: 25px;
line-height: 25px;
margin-left: 10px;
font-family: "Arial Narrow";
font-size: 15px;
color: #FFFF99;
text-align: left;
text-decoration: none;
background-color: transparent;
border-bottom: 1px dashed #000000;
}
a.sub_navigation:hover {
display: block;
color: #FEFEFE;
text-decoration: none;
background-color: transparent;
}

So in etwa ?