Lexi Help
Die neuesten Themen
» [phpBB2] Im Beitrag Bild und Text nebeneinander anzeigen
von Bigtuber Heute um 20:54

» Themen-Icons
von Bigtuber Heute um 20:46

» [phpBB2] Schriftfarbe in der Expressantwort
von Bigtuber Heute um 20:09

» Themen fixieren
von inde Heute um 20:05

» Impressum
von Bigtuber Heute um 19:10

» [Update] Neues Theme der mobilen Version V2
von inde Heute um 13:34

» Mein altes Forum zurückbekommen
von Bigtuber Gestern um 19:18

» Begriff : "merken"
von Ray Gestern um 12:14

» [PunBB] Umzug eines funktionierenden Forums von PunBB auf phpBB?
von inde Gestern um 11:07

» Servamp Forum
von Raine Kamiya Mo 26 Sep 2016 - 22:47

» [phpBB2] Probleme mit der "Postprofil" Anzeige
von Dr.Keks Mo 26 Sep 2016 - 20:56

» Private Nachrichten
von inde Mo 26 Sep 2016 - 10:05

» Wie kann man erkennen, welche Forenversion ein anderes Forum hat?
von inde So 25 Sep 2016 - 22:24

» Ad Ware im Forum?
von inde So 25 Sep 2016 - 20:38

» [Sammelthread] Unangebrachte Werbung
von inde Fr 23 Sep 2016 - 9:00

» [phpBB2] Gruppen in der Wer is Online Anzeige "trennen"
von TheRollyJoger Mi 21 Sep 2016 - 10:49

Partner
free forum

[phpBB2] Dropdown-Menü

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach unten

Offen [phpBB2] Dropdown-Menü

Beitrag von dream-walkers.de am Di 17 Sep 2013 - 19:25

Huhu.

Ich bastel gerade vor mich hin, ein bisschen was ausprobieren etc. Ich habe eine zusätzliche Box auf der Index hinzugefügt und möchte in dieses nun ein Dropdownmenü einfügen, welches zu den Teamgruppen und zu den einzelnen Teammitgliedern verlinkt. Also nicht auf einmal, das wär ja schwachsinnig, hab mal ne Zeichnung gemacht.
http://abload.de/img/unbenanntwbsdf.png

Code:
[b]<!-- BEGIN teamBox_on_index -->
<table class="teamBox" width="100%" border="2px">
   <tr>
      <th class="teamBoxHead" height="20px">Das Team</th>
   </tr>
   <tr>
      <td class="teamBoxInner" height="200px">
         <div id='teamMenu'>
            <ul>
               <li class='admins'><a href='#'><span>Admins</span></a>
                  <ul>
                     <li><a href='#'><span>Haselnussfeder</span></a></li>
                     <li><a href='#'><span>Vanilleblatt</span></a></li>
                     <li class='last'><a href='#'><span>Wolfsherz</span></a></li>
                  </ul>
               </li>
               <li class='mods'><a href='#'><span>Mods</span></a>
                  <ul>
                     <li class='last'><a href='#'><span>Jubelschrei</span></a></li>
                  </ul>
               </li>
            </ul>
         </div>
      </td>
   </tr>
</table>
<!-- END teamBox_on_index -->[/b]
Das ist das, was ich ins Template geschrieben habe (an der richtigen Stelle, wenn ich statt des <div> </div> Krams nur Text schreibe, wird die Box dort angezeigt, wo sie hin soll.

Code:
#teamMenu ul {
  margin: 0;
  padding: 0;
}
#teamMenu li {
  margin: 0;
  padding: 0;
}
#teamMenu a {
  margin: 0;
  padding: 0;
}
#teamMenu ul {
  list-style: none;
}
#teamMenu a {
  text-decoration: none;
}
#teamMenu {
  height: 70px;
  background-color: #232323;
  box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.4);
  width: auto;
}
#teamMenu > ul > li {
  float: left;
  margin-left: 15px;
  position: relative;
}
#teamMenu > ul > li > a {
  color: #a0a0a0;
  font-family: Verdana, 'Lucida Grande';
  font-size: 15px;
  line-height: 70px;
  padding: 15px 20px;
  -webkit-transition: color .15s;
  -moz-transition: color .15s;
  -o-transition: color .15s;
  transition: color .15s;
}
#teamMenu > ul > li > a:hover {
  color: #ffffff;
}
#teamMenu > ul > li > ul {
  opacity: 0;
  visibility: hidden;
  padding: 16px 0 20px 0;
  background-color: #fafafa;
  text-align: left;
  position: absolute;
  top: 55px;
  left: 50%;
  margin-left: -90px;
  width: 180px;
  -webkit-transition: all .3s .1s;
  -moz-transition: all .3s .1s;
  -o-transition: all .3s .1s;
  transition: all .3s .1s;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4);
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4);
}
#teamMenu > ul > li:hover > ul {
  opacity: 1;
  top: 65px;
  visibility: visible;
}
#teamMenu > ul > li > ul:before {
  content: '';
  display: block;
  border-color: transparent transparent #fafafa transparent;
  border-style: solid;
  border-width: 10px;
  position: absolute;
  top: -20px;
  left: 50%;
  margin-left: -10px;
}
#teamMenu > ul ul > li {
  position: relative;
}
#teamMenu ul ul a {
  color: #323232;
  font-family: Verdana, 'Lucida Grande';
  font-size: 13px;
  background-color: #fafafa;
  padding: 5px 8px 7px 16px;
  display: block;
  -webkit-transition: background-color 0.1s;
  -moz-transition: background-color 0.1s;
  -o-transition: background-color 0.1s;
  transition: background-color 0.1s;
}
#teamMenu ul ul a:hover {
  background-color: #f0f0f0;
}
#teamMenu ul ul ul {
  visibility: hidden;
  opacity: 0;
  position: absolute;
  top: -16px;
  left: 206px;
  padding: 16px 0 20px 0;
  background-color: #fafafa;
  text-align: left;
  width: 180px;
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4);
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.4);
}
#teamMenu ul ul > li:hover > ul {
  opacity: 1;
  left: 190px;
  visibility: visible;
}
#teamMenu ul ul a:hover {
  background-color: #8db4cd;
  color: #f0f0f0;
}
Und das zugehörige CSS.

Ich habe es bereits mehrfach überprüft und bis auf ein paar Schönheitsfehler nichts gefunden, keine ungeschlossenen Tags oder Schreibfehler.

Bin ich so vom Gedankengang her auf der richtigen Fährte? ~


Zuletzt von dream-walkers.de am Di 17 Sep 2013 - 20:14 bearbeitet, insgesamt 1 mal bearbeitet

dream-walkers.de
Neuling
Neuling

Beiträge : 12
Anmeldedatum : 27.03.13

Nutzerprofil anzeigen

Nach oben Nach unten

Offen Re: [phpBB2] Dropdown-Menü

Beitrag von Günther am Di 17 Sep 2013 - 20:03

Hallo,

du findest hier über die Suchfunktion einige Themen dazu, vor allem aber über Google unzählige Websites, die Codes für solche Dropdown-Menüs frei anbieten. Wink

Falls du deinen Code selbst geschrieben hast, kannst du diese fertigen Codes verwenden, was viel einfacher ist und einen Erfolg sicherstellt.
Falls du den Code nicht selbst geschrieben hast, kannst du hier zumindest die Quelle nennen und wir können uns mal ein Bild davon machen, ob dieser Code grundsätzlich mit Forumieren-Foren kompatibel ist und ob du Umsetzungsfehler gemacht hast.
Aber ohne all das zu wissen, können wir uns deinen Code nicht im Detail ansehen - das wäre weder sinnvoll noch würde es dich schneller dem Ziel näherbringen. Wink

Liebe Grüße
Günther

Günther
Admin a.D.
Admin a.D.

Männlich Beiträge : 15349
Anmeldedatum : 16.07.08
Firefox

Nutzerprofil anzeigen

Nach oben Nach unten

Offen Re: [phpBB2] Dropdown-Menü

Beitrag von dream-walkers.de am Di 17 Sep 2013 - 20:09

Ich hab ihn selber geschrieben, aus dem einfachen Grund, da es mir hierbei nicht um das Ergebnis selber geht, sondern um den Weg. Ich möchte das gerne selber gemacht haben, denn Codes kopieren und einfügen kann jeder und selbst Farbcodes darin austauschen kann man auch ohne HTML-Kenntnisse.
Ich möchte aus dem, was ich mache, halt etwas lernen. ~

dream-walkers.de
Neuling
Neuling

Beiträge : 12
Anmeldedatum : 27.03.13

Nutzerprofil anzeigen

Nach oben Nach unten

Offen Re: [phpBB2] Dropdown-Menü

Beitrag von Günther am Di 17 Sep 2013 - 20:14

Das finde ich sehr gut, so bist du tatsächlich auf dem richtigen Weg, "learning by doing" zu betreiben! top 

Da es sich in diesem Fall aber um kein Supportthema handelt, sondern um ein allgemeines Codingthema, verschiebe ich es nach "Allgemeine Diskussionen".

Noch ein Hinweis: In diesem Fall geht es in erster Linie darum, ob dein HTML- und CSS-Code zum gewünschten Effekt führt. Wenn das sichergestellt ist, kann es beim Einsetzen in dein Forum eigentlich keine Probleme mehr geben.
Denkst du also nicht, dass du in einem HTML-/CSS- bzw. Webdesign-Forum am besseren Ort wärst? Denn dort geht es - im Gegensatz zu diesem Support - wirklich darum, coden zu lernen und eigene Codes gemeinsam auszubessern und funktionsfähig zu machen. Smile

Günther
Admin a.D.
Admin a.D.

Männlich Beiträge : 15349
Anmeldedatum : 16.07.08
Firefox

Nutzerprofil anzeigen

Nach oben Nach unten

Offen Re: [phpBB2] Dropdown-Menü

Beitrag von dream-walkers.de am Di 17 Sep 2013 - 21:10

Ich hab die Frage einmal in dem Webtechnik Forum meines Vertrauens gestellt, heißt aber nicht, dass hier nicht auch Antworten kommen dürfen *husthusthust*. :3 ~

dream-walkers.de
Neuling
Neuling

Beiträge : 12
Anmeldedatum : 27.03.13

Nutzerprofil anzeigen

Nach oben Nach unten

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach oben


 
Forenbefugnisse:
Sie können in diesem Forum nicht antworten