MyBB.de Forum

Normale Version: Mod Idee: Dropdownmenu im Showthread Template
Du siehst gerade eine vereinfachte Darstellung unserer Inhalte. Normale Ansicht mit richtiger Formatierung.
Hi, alle zusammen!

Hier noch eine Idee!

Dazu habe ich folgendes verändert:

Im Standardtheme hab ich unter "Zusätzliches CSS" das eingefügt:

Code:
whatever {
    display: none;
    }
whatever:hover {
    display: inline;
    position: absolute;
    z-index: 10;
    }
ul#Navigation  {margin-left:1em; padding:0; list-style:none;}
ul#Navigation li {float:left; margin:0; padding:0; list-style:none; border:1px solid #000; background:#fff; width:200px; padding-left:10px; color:#000; font-family: Arial; font-size:12px;}
ul#Navigation li:hover {background: #fff;}
ul#Navigation2 {display: none; margin:0; padding:0; list-style: none;}
ul#Navigation2 li {margin:0; padding:0; list-style: none; border:0;}
ul#Navigation2 li:hover {margin:0; padding:0; list-style: none; border:0; background:#B0C4DE; display: block;}
#Navigation li:hover ul#Navigation2 {display: block; position: absolute;}
ul#Navigation a:link, ul#Navigation a:visited {color:#000; text-decoration:none; display: block; width:100%;}
ul#Navigation a:hover, ul#Navigation a:active, ul#Navigation a:focus {color:#000; text-decoration:none; display: block;}
div.dm {height:9em;}
div.dm ul {display:none; margin-bottom:0;}
div.dm:hover ul {display: block;}
  body, p a {
    behavior: url("csshover2.htc"); /* call hover behaviour file */
    font-size: 100%; /* enable IE to resize em fonts */
  }
  #menu ul li {
    float: left; /* cure IE5.x "whitespace in lists" problem */
    width: 100%;
  }
  #menu ul li a {
    height: 1%; /* make links honour display: block; properly */
  }
  #menu a, #menu h2 {
    font: 12px Trebuchet MS; /* if required use em's for IE as it won't resize pixels */
  }
  div#Rahmen {
    padding: 0;
    border: 0;
  }
  ul#Navigation {
    margin: 0; padding: 0;
    text-align: center;
  }
  ul#Navigation li {
    list-style: none;
    float: left;
    width: 16.6em;
    position: relative;
    margin: 0; padding: 0;
  }
  * html ul#Navigation li {  /* Korrektur fuer den IE */
    margin-bottom: -0.4em;
  }
  ul#Navigation li ul {
    margin: 0; padding: 0;
    position: absolute;
    left: -0.4em;
  }
  * html ul#Navigation li ul {  /* Korrektur fuer IE 5.x */
    left: -1.5em;
    left: -0.4em;
  }
  ul#Navigation li ul li {
    float: left;
    display: block;
  }
  ul#Navigation a, ul#Navigation span {
    display: block;
    text-decoration: none; font-weight: bold;
    border: 1px solid black;
    border-left-color: white; border-top-color: white;
    background-color: #fff;
  }
  * html ul#Navigation a, * html ul#Navigation span {  /* nur fuer IE erforderlich */
    width: 100%;
    width: 16.4em;
  }
  ul#Navigation a:hover, ul#Navigation span, li a#aktuell {
    border-color: white;
    border-left-color: black; border-top-color: black;
  }
  /* Erweiterung zur dynamischen Ein-/Ausblendung */
  ul#Navigation li>ul {
    display: none;
  }
  ul#Navigation li:hover>ul, ul#Navigation li>a#aktuell+ul {
    display: block;
  }
Die Datei csshover2.htc kann man HIER 'runterladen.

Dann muß das Template "showthread" verändert werden:
(die beiden Menüpunkte "Baumstrukturmodus" und "Brettstrukturmodus" sind nach unten gewandert, dafür sind die Thema-Optionen "Druckversion anzeigen" usw. in einem schönen Dropdownmenü im ersten Thread rechts in der Ecke)

Das muß weg:
Code:
        <span class="smalltext"><strong><a href="showthread.php?mode=threaded&amp;tid={$tid}&amp;pid={$pid}#pid{$pid}">{$lang->threaded}</a> | <a href="showthread.php?mode=linear&amp;tid={$tid}&amp;pid={$pid}#pid{$pid}">{$lang->linear}</a></strong></span>

Und muß hierdurch ersetzt werden:
Code:
<div id="Rahmen"><ul id="Navigation">
<li><a><b>Thema-Optionen</b></a><ul id="Navigation2">
    <li><a href="printthread.php?tid={$tid}"><img src="$theme[imgdir]/printable.gif" border="0"/> {$lang->view_printable}</a></li>
    <li><a href="sendthread.php?tid={$tid}"><img src="$theme[imgdir]/send.gif" border="0"/> {$lang->send_thread}</a></li>
    <li><a href="usercp2.php?action=addsubscription&amp;tid={$tid}"><img src="$theme[imgdir]/menu/subscribe.gif" border="0"/> {$lang->subscribe_thread}</a></li>
    <li><a href="usercp2.php?action=addfavorite&amp;tid={$tid}"><img src="$theme[imgdir]/menu/subscribe.gif" border="0"/> {$lang->add_favorites}</a></li></ul>
</ul></div>

Unter
Code:
{$threadpages}
<tr>
<td colspan="2" class="tfoot">
    <div style="float: right;">

Muß das eingefügt werden:
Code:
<div id="Rahmen"><ul id="Navigation">
<li><a><b>Ansicht</b></a><ul id="Navigation2">
    <li><a href="showthread.php?mode=threaded&amp;tid={$tid}&amp;pid={$pid}#pid{$pid}"><img src="$theme[imgdir]/menu/mode_threaded.gif" border="0"/> {$lang->threaded}</a></li>
    <li><a href="showthread.php?mode=linear&amp;tid={$tid}&amp;pid={$pid}#pid{$pid}"><img src="$theme[imgdir]/menu/mode_linear.gif" border="0"/> {$lang->linear}</a></li></ul></li>
</ul></div>

Wenn man mag kann man noch ein kleines Bildchen vor die Optionen schalten. Dafür hab ich im Images-Ordner den Ordner "menu" angelegt.
Ich häng die Bilder dazu mal an.


Wer sich das mal anschauen will, hier ein Testlink: Test

Fänd ich super, wenn das jemand als Mod schreiben könnte!

Liebe Grüße, GM!
man kann beides machen:

entweder das Plugin ändert die Templates sofort oder
man ändert das mit str_replace, das während beim laden ersetzt wird.
HI, Sebijk!

Plugin wäre mir lieber!Big Grin

"str_replace"? Was ist das? Wie benutzt man das?

Liebe Grüße, GM!
also mit str_replace kann man die Templates automatisiert, während des Startvorgangs ersetzen. Damit muss man keine Templateänderungen in Templates machen. Ist nützlich, wenn man mehrere Styles hat.

Wie man str_replace benutzt, kannst du an meinen Plugin "Logout Abfrage" sehen.

Zu den Mod selbst: Ist ne ganz tolle Idee, sieht so ähnlich wie beim vB aus (Demo: http://www.sebijk.de/forum/showthread.php?t=1784 ), nur das beim vB mit Klick gemacht wird.

MyBB 1.2 hat aber auch seinen eigenen Menüfunktionen, d. h. dass man extra Dateien nicht braucht,
allerdings weiß ich es nicht, ob das mit MouseOver auch so einwandfrei funzt, wie mit deinen Dateien.
HI, Sebijk!

*g* Ja, ich hab mich beim erstellen, da vom vB inspirieren lassen! Wink

Zitat:MyBB 1.2 hat aber auch seinen eigenen Menüfunktionen, d. h. dass man extra Dateien nicht braucht,
allerdings weiß ich es nicht, ob das mit MouseOver auch so einwandfrei funzt, wie mit deinen Dateien.
Was meinst du damit? MyBB hat seine eigenen Menüfunktionen? MouseOver? *nixblick*

Liebe Grüße, GM!
Ich habs jetzt geschafft, dass der IE das Menü nun auch richtig anzeigt!! *freu*
Hab den Code oben geändert!

... leider kann wohl nur der IE7 den Code richtig interpretieren.
Dafür sind keine Probleme mit Opera oder FF aufgetreten!

... wieso steht dieser Thread denn nu unter "Diskussion"???

Liebe Grüße, GM!
Das steht da, weil ich es verschoben habe. Es ist ja keine Idee, da du schon alles gemacht hast und nur die Probleme diskutierst. Wenn hier alles funktioniert, können wir immer noch ein Plugin daraus machen.
Hi, Dragon!

*g* Der Code ist schon soweit. Auch schon bei mir aktiv angewendet. ;-)
Ich wußt jetzt nur noch nicht wie's weitergeht.

Probleme macht der Code wie gesagt nur noch mit den alten IE Versionen aber das ist ein Browserproblem.

LG, GM!
HI, alle zusammen!

Inzwischen habe ich das alles umgemodelt und mit JavaScript gemacht.
Ich hab dabei auf die Menücodierung des Themes "BlueFish" (ich glaub es hieß auch mal "Blue Fish (wie vBulletin)") zurückgegriffen und alles etwas verändert und umgemodelt.
Da ich auf zwei JavaScripte und etwas HTML+JavaScript-Code aus dem Theme verwendet habe, weiß ich nicht, wie das mit veröffentlichen aussieht. Design (Menüdesign, Grafiken und Farben) habe ich nicht übernommen.

Kann man in leichter Form auf meinem Forum sehen.

LG, GM!