Aufklappbare Menüs ... aber wie?

Allgemeiner Support zum phpBB 2 Board und phpBB 2 Modifikationen
Forumsregeln
Auch wenn hier der Support für phpBB 2 weiterhin aufrecht erhalten bleibt, weisen wir darauf hin, dass das phpBB 2 nicht mehr offiziell unterstützt und weiterentwickelt wird!
Antworten
butzi
Beiträge: 18
Registriert: Mo 02.Mai, 2005 21:56

Aufklappbare Menüs ... aber wie?

Beitrag von butzi »

Ich bastel mir gerade eine Side-Bar zurecht auf Grundlage von CBACK's Index Sidebar
Nun suche ich eine Möglichkeit, die Kategorien (siehe Bild -> Forum, Foren Übersicht, Einstellungen) jeweils aufklappen zu lassen, um dann die Links in der Kategorie zu sehen. Das soll so wie bei dem Kalender funktionieren, oder so, wie hier bei den Optionen.
Ich habe die plus Version. Der Code der Sidebar sieht im Moment so aus.

Sollte noch erwähnen daß ich die Sidebar in der index_body_plus.tpl eingefügt habe.

Code: Alles auswählen

<!-- BEGIN Sidebar 1 -->
<table width="100%" cellpadding="0" cellspacing="0" border="0">
  <tr>
    <td style="vertical-align:top;">
      <table width="100%" cellpadding="2" cellspacing="1" class="forumline">
       <tr>
	     <th width="100%" cellspacing="1" cellpadding="2" class="thCornerL" height="25" nowrap="nowrap">&nbsp;{L_SIDEBAR}&nbsp;</th>  
       </tr>
       <tr>
         <td class="row2"><span class="explaintitle"><center><b>{L_SIDEBAR_FORUM}</b></center></td>
       </tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_FAQ}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_FAQ}</a></span></td>
       </tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="rules.php"><img src="templates/fisubsilversh/images/arrow.gif"> Rules</a></span></td>
       </tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_SEARCH}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_SEARCH}</a></span></td>
       </tr>
 
          <td class="row2"><span class="gensmall"><a href="{U_STATISTICS}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_STATISTICS}</a></span></td>
	</tr>
<tr>
   <td class="row2"><span class="gensmall"><a href="{U_DOWNLOAD}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_DOWNLOAD}</a></span></td>
</tr>
<tr>
   <td class="row2"><span class="gensmall"><a href="{U_DOWNLOADS}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_DOWNLOADS}</a></span></td>
</tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_MEMBERLIST}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_MEMBERLIST}</a></span></td>
       </tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_GROUP_CP}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_USERGROUPS}</a></span></td>
       </tr>
       
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_ALBUM}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_ALBUM}</a></span></td>
       </tr>
        <tr>
         <td class="row2"><span class="explaintitle"><center><b>{L_SIDEBAR_BOARD}</b></center></td>
       </tr>
       <tr>
                <td class="row2"><span class="gensmall"><a href="index.php?c=3"><img src="templates/fisubsilversh/images/arrow.gif"> Boardinternes</a></span></td>
       </tr>
       <tr>
         <td class="row2"><span class="explaintitle"><center><b>{L_SIDEBAR_SETTINGS}</b></center></td>
       </tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_PROFILE}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_PROFILE}</a></span></td>
       </tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_PRIVATEMSGS}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_PRIVATEMSGS}</a></span></td>
       </tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_LOGIN_LOGOUT}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_LOGIN_LOGOUT}</a></span></td>
       </tr>
      </table>
      <br />
      <script type="text/javascript">
      <!--
      function checkSearch()
      {
      if (document.search_block.search_engine.value == 'google')
      {
      window.open('http://www.google.com/search?q=' + document.search_block.search_keywords.value, '_google', '');
      return false;
      }
      else
      {
      return true;
      } 
      }
      //-->
      </script>
      <form name="search_block" method="post" action="{U_SEARCH}" onsubmit="return checkSearch()">
        <table width="100%" cellpadding="2" cellspacing="1" class="forumline">
           <tr>
	         <th width="126px" cellspacing="2" cellpadding="2" class="thCornerL" height="25" nowrap="nowrap">&nbsp;{L_SEARCH}&nbsp;</th>  
           </tr>
      <tr>
         <td align="center" class="row1"><table border="0" cellspacing="0" cellpadding="2">
           <tr>
             <td align="center"><input class="post" type="text" name="search_keywords" size="15" /></td>
           </tr>
         <tr>
           <td align="center"><select class="post" name="search_engine">
             <option value="site">{L_FORUM}</option>
             <option value="google">Google</option>
           </select></td>
         </tr>
         <tr>
           <td align="center"><input class="mainoption" type="submit" value="{L_SEARCH}" /></td> 
         </tr>
      </table>
      <input type="hidden" name="search_fields" value="all" /> 
      <input type="hidden" name="show_results" value="topics" />
      <br />
      <a href="{U_SEARCH}" class="gensmall">{L_ADVANCED_SEARCH}</a>
    </td>
   </tr>
</table>
</form>
    </td>
  <td style="vertical-align:top;">
<!-- END Sidebar 1 -->
Zuletzt geändert von butzi am Mo 23.Mai, 2005 13:53, insgesamt 1-mal geändert.
Benutzeravatar
oxpus
Administrator
Beiträge: 28735
Registriert: Mo 27.Jan, 2003 22:13
Wohnort: Bad Wildungen
Kontaktdaten:

Beitrag von oxpus »

Da Du das plus verwendest, brauchen wir die toggle.js noch nichtmal mehr anhängen.
Hier der geänderte Code:

Code: Alles auswählen

<script language="JavaScript" type="text/javascript" src="includes/toggle_display.js"></script>
<!-- BEGIN Sidebar 1 -->
<table width="100%" cellpadding="0" cellspacing="0" border="0">
  <tr>
    <td style="vertical-align:top;">
      <table width="100%" cellpadding="2" cellspacing="1" class="forumline">
       <tr>
	     <th width="100%" cellspacing="1" cellpadding="2" class="thCornerL" height="25" nowrap="nowrap">&nbsp;{L_SIDEBAR}&nbsp;</th>  
       </tr>
       <tr>
         <td class="row2"><span class="explaintitle"><center><a href="#" onClick="hdr_toggle('forum','forum_open_close', 'templates/fisubsilversh/images/icon_down_arrow.gif', 'templates/fisubsilversh/images/icon_up_arrow.gif'); return false;" /><img src="templates/fisubsilversh/images/icon_up_arrow.gif" id="forum_open_close" border="0"/>&nbsp;<b>{L_SIDEBAR_FORUM}</b></a></center></td>
       </tr>
<tbody id="forum" style="display:">
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_FAQ}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_FAQ}</a></span></td>
       </tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="rules.php"><img src="templates/fisubsilversh/images/arrow.gif"> Rules</a></span></td>
       </tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_SEARCH}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_SEARCH}</a></span></td>
       </tr>
 
          <td class="row2"><span class="gensmall"><a href="{U_STATISTICS}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_STATISTICS}</a></span></td>
	</tr>
	<tr>
	   <td class="row2"><span class="gensmall"><a href="{U_DOWNLOAD}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_DOWNLOAD}</a></span></td>
	</tr>
	<tr>
	   <td class="row2"><span class="gensmall"><a href="{U_DOWNLOADS}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_DOWNLOADS}</a></span></td>
	</tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_MEMBERLIST}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_MEMBERLIST}</a></span></td>
       </tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_GROUP_CP}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_USERGROUPS}</a></span></td>
       </tr>
       
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_ALBUM}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_ALBUM}</a></span></td>
       </tr>
</tbody>
        <tr>
         <td class="row2"><span class="explaintitle"><center><a href="#" onClick="hdr_toggle('settings','settings_open_close', 'templates/fisubsilversh/images/icon_down_arrow.gif', 'templates/fisubsilversh/images/icon_up_arrow.gif'); return false;" /><img src="templates/fisubsilversh/images/icon_down_arrow.gif" id="settings_open_close" border="0"/>&nbsp;<b>{L_SIDEBAR_BOARD}</b></a></center></td>
       </tr>
<tbody id="settings" style="display:none">
       <tr>
                <td class="row2"><span class="gensmall"><a href="index.php?c=3"><img src="templates/fisubsilversh/images/arrow.gif"> Boardinternes</a></span></td>
       </tr>
</tbody>
       <tr>
         <td class="row2"><span class="explaintitle"><center><a href="#" onClick="hdr_toggle('sidebar','sidebar_open_close', 'templates/fisubsilversh/images/icon_down_arrow.gif', 'templates/fisubsilversh/images/icon_up_arrow.gif'); return false;" /><img src="templates/fisubsilversh/images/icon_down_arrow.gif" id="sidebar_open_close" border="0"/>&nbsp;<b>{L_SIDEBAR_SETTINGS}</b></a></center></td>
       </tr>
<tbody id="sidebar" style="display:none">
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_PROFILE}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_PROFILE}</a></span></td>
       </tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_PRIVATEMSGS}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_PRIVATEMSGS}</a></span></td>
       </tr>
       <tr>
         <td class="row2"><span class="gensmall"><a href="{U_LOGIN_LOGOUT}"><img src="templates/fisubsilversh/images/arrow.gif"> {L_LOGIN_LOGOUT}</a></span></td>
       </tr>
</tbody>
      </table>
      <br />
      <script type="text/javascript">
      <!--
      function checkSearch()
      {
      if (document.search_block.search_engine.value == 'google')
      {
      window.open('http://www.google.com/search?q=' + document.search_block.search_keywords.value, '_google', '');
      return false;
      }
      else
      {
      return true;
      } 
      }
      //-->
      </script>
      <form name="search_block" method="post" action="{U_SEARCH}" onsubmit="return checkSearch()">
        <table width="100%" cellpadding="2" cellspacing="1" class="forumline">
           <tr>
	         <th width="126px" cellspacing="2" cellpadding="2" class="thCornerL" height="25" nowrap="nowrap">&nbsp;{L_SEARCH}&nbsp;</th>  
           </tr>
      <tr>
         <td align="center" class="row1"><table border="0" cellspacing="0" cellpadding="2">
           <tr>
             <td align="center"><input class="post" type="text" name="search_keywords" size="15" /></td>
           </tr>
         <tr>
           <td align="center"><select class="post" name="search_engine">
             <option value="site">{L_FORUM}</option>
             <option value="google">Google</option>
           </select></td>
         </tr>
         <tr>
           <td align="center"><input class="mainoption" type="submit" value="{L_SEARCH}" /></td> 
         </tr>
      </table>
      <input type="hidden" name="search_fields" value="all" /> 
      <input type="hidden" name="show_results" value="topics" />
      <br />
      <a href="{U_SEARCH}" class="gensmall">{L_ADVANCED_SEARCH}</a>
    </td>
   </tr>
</table>
</form>
    </td>
  <td style="vertical-align:top;">
<!-- END Sidebar 1 -->
Damit wird "Forum" offen, die beiden folgenden Kategorien geschlossen geladen.
Karsten Ude
-={ Das Mädchen für alles }=-
Kein Support per Messenger, Email oder PN! Unaufgeforderte Nachrichten werden ignoriert!
No support per Messenger, Email or PM. Each unasked message will be ignored!
Stoebi
Beiträge: 447
Registriert: Do 24.Feb, 2005 16:35
Wohnort: Berlin
Kontaktdaten:

Beitrag von Stoebi »

Verstehe ich nicht!

Du schreibst:
Da Du das plus verwendest, brauchen wir die toggle.js noch nichtmal mehr anhängen.

Warum nicht? Ich habe keine toggle.js im Plus Board.
Zuletzt geändert von Stoebi am So 05.Jun, 2005 16:12, insgesamt 4-mal geändert.
butzi
Beiträge: 18
Registriert: Mo 02.Mai, 2005 21:56

Beitrag von butzi »

Suuuper. Danke, funktioniert prima. Werde mir das jetzt noch weiter ausbauen.

Hab da gleich mal noch eine Frage:
Wie kann ich die Post ID über einen (bzw. des jeweiligen) Beitrags anzeigen lassen? Ich wollte nach dem Textes "Verfasst am:...", der über einen Beitrag steht, die Post ID sehen, am besten als Link, damit man direkt zu diesem Beitrag verlinken kann. Das ist bei längeren Themen ja ganz sinnvoll, wenn man auf einen bestimmten Beitrag verweisen möchte.
Zuletzt geändert von butzi am Mo 23.Mai, 2005 22:27, insgesamt 1-mal geändert.
modbo
Beiträge: 1344
Registriert: Mo 13.Dez, 2004 11:18
Kontaktdaten:

Beitrag von modbo »

Die Post ID verbirgt sich doch hinter dem Bild in jedem Beitrag ;)
Rechte Maustaste und Verknüpfung kopieren.
Zuletzt geändert von modbo am Mo 23.Mai, 2005 22:48, insgesamt 1-mal geändert.
butzi
Beiträge: 18
Registriert: Mo 02.Mai, 2005 21:56

Beitrag von butzi »

Ups, da hätte ich auch drauf kommen können :rolleyes:
Benutzeravatar
oxpus
Administrator
Beiträge: 28735
Registriert: Mo 27.Jan, 2003 22:13
Wohnort: Bad Wildungen
Kontaktdaten:

Beitrag von oxpus »

@stoebi
Genau genommen heisst die includes/toggle_display.js ;)
Karsten Ude
-={ Das Mädchen für alles }=-
Kein Support per Messenger, Email oder PN! Unaufgeforderte Nachrichten werden ignoriert!
No support per Messenger, Email or PM. Each unasked message will be ignored!
butzi
Beiträge: 18
Registriert: Mo 02.Mai, 2005 21:56

Beitrag von butzi »

Jetzt habe ich mal versucht, Submenüs einzubauen, aber irgendwie will das nicht recht klappen. Im Menü ist dann immer nur das erste Submenü zunächst versteckt. Die Anderen werden von Anfang an angezeigt, oder, wenn ich </tbody> dazwischen entferne als "Sub-Submenü".

Hier mal die entsprechenden Zeilen aus der index_body_plus.tpl

Code: Alles auswählen

	<tr><td class="row2"><span class="explaintitle"><a href="#" onClick="hdr_toggle('links','links_open_close', 'templates/fiblue3d/images/icon_down_arrow.gif', 'templates/fiblue3d/images/icon_up_arrow.gif'); return false;" /><img src="templates/fiblue3d/images/icon_down_arrow.gif" id="links_open_close" border="0"/>&nbsp;<b>{L_SIDEBAR_LINKS}</b></a></td></tr>
<tbody id="links" style="display:none">
	<tr><td class="row2"><span class="gensmall"><a href="#" onClick="hdr_toggle('movies','movies_open_close', 'templates/fiblue3d/images/icon_down_arrow.gif', 'templates/fiblue3d/images/icon_up_arrow.gif'); return false;" />&nbsp;&nbsp;&nbsp;<img src="templates/fiblue3d/images/icon_down_arrow.gif" id="movies_open_close" border="0"/>&nbsp;{L_SIDEBAR_MOVIES}</a></td></tr>
<tbody id="movies" style="display:none">
	       		<tr><td class="row2"><span class="gensmall"><img src="templates/fiblue3d/images/arrow.gif"> <a href="http://www.ofdb.de/" target="_blank"><img src="http://www.ofdb.de/images/banner3.gif" width="88" height="31"> OFDB</a></td></tr>
	       	       	<tr><td class="row2"><span class="gensmall"><img src="templates/fiblue3d/images/arrow.gif"> <a href="http://german.imdb.com/" target="_blank"><img src="" width="88" height="31" border="0">IMDB</a><br /></td></tr>
	       	       	<tr><td class="row2"><span class="gensmall"><img src="templates/fiblue3d/images/arrow.gif"><a href="http://www.areadvd.de/index.html" target="_blank"> areadvd.de</a><br /></td></tr>

<tr><td class="row2"><span class="gensmall"><a href="#" onClick="hdr_toggle('phpbb','phpbb_open_close', 'templates/fiblue3d/images/icon_down_arrow.gif', 'templates/fiblue3d/images/icon_up_arrow.gif'); return false;" />&nbsp;&nbsp;&nbsp;<img src="templates/fiblue3d/images/icon_down_arrow.gif" id="phpbb_open_close" border="0"/>&nbsp;{L_SIDEBAR_PHPBB}</a></td></tr>
<tbody id="phpbb" style="display:none">
	       	       	<tr><td class="row2"><span class="gensmall"><img src="templates/fiblue3d/images/arrow.gif"><a href="http://www.oxpus.de" target="_blank"> oxpus.de</a><br /></td></tr>
	       	       	<tr><td class="row2"><span class="gensmall"><img src="templates/fiblue3d/images/arrow.gif"><a href="http://mods.db9.dk/" target="_blank"> mods.db9.dk</a><br /></td></tr>
	       	       	<tr><td class="row2"><span class="gensmall"><img src="templates/fiblue3d/images/arrow.gif"><a href="http://www.phpbbhacks.com/" target="_blank"> phpbbhacks.com</a><br /></td></tr>
	       	       	<tr><td class="row2"><span class="gensmall"><img src="templates/fiblue3d/images/arrow.gif"><a href="........."> .......</a><br /></td></tr>
</tbody>
<tr><td class="row2"><span class="gensmall"><a href="#" onClick="hdr_toggle('windows','windows_open_close', 'templates/fiblue3d/images/icon_down_arrow.gif', 'templates/fiblue3d/images/icon_up_arrow.gif'); return false;" />&nbsp;&nbsp;&nbsp;<img src="templates/fiblue3d/images/icon_down_arrow.gif" id="windows_open_close" border="0"/>&nbsp;{L_SIDEBAR_WINDOWS}</a></td></tr>
<tbody id="windows" style="display:none">
       			<tr><td class="row2"><span class="gensmall"><img src="templates/fiblue3d/images/arrow.gif"><a href="http://www.wintotal.de/" target="_blank"> wintotal.de/</a></td></tr>
       			<tr><td class="row2"><span class="gensmall"><img src="templates/fiblue3d/images/arrow.gif"><a href="http://winfuture.de//" target="_blank"> winfuture.de//</a></td></tr>
</tbody>
Zuletzt geändert von butzi am Sa 28.Mai, 2005 11:37, insgesamt 1-mal geändert.
Benutzeravatar
oxpus
Administrator
Beiträge: 28735
Registriert: Mo 27.Jan, 2003 22:13
Wohnort: Bad Wildungen
Kontaktdaten:

Beitrag von oxpus »

Also innerhalb eines aufklappbaren Bereiches einen weiteren?
Karsten Ude
-={ Das Mädchen für alles }=-
Kein Support per Messenger, Email oder PN! Unaufgeforderte Nachrichten werden ignoriert!
No support per Messenger, Email or PM. Each unasked message will be ignored!
butzi
Beiträge: 18
Registriert: Mo 02.Mai, 2005 21:56

Beitrag von butzi »

Ja, ein Weiteres klappt ja, aber wenn ich mehr als eine Unterkategorie einfügen will, geht das nicht mehr. Da wird praktisch nur die erste Unterkategorie auch als solche angezeigt, also erst sichtbar, nachdem ich die Hauptkategorie aufklappe.
Die anderen folgenden Unterkategorien sind wie die Hauptkategorien sofort sichtbar, beim Laden der Seite.
Benutzeravatar
oxpus
Administrator
Beiträge: 28735
Registriert: Mo 27.Jan, 2003 22:13
Wohnort: Bad Wildungen
Kontaktdaten:

Beitrag von oxpus »

Ah ja, wieder was gelernt.
Scheint dann nicht zu klappen.
Da muss ich auch passen, wie man das löst.
Vielleicht mit Java oder DHTML.
Bin ich aber komplett umwissend drinnen.
Karsten Ude
-={ Das Mädchen für alles }=-
Kein Support per Messenger, Email oder PN! Unaufgeforderte Nachrichten werden ignoriert!
No support per Messenger, Email or PM. Each unasked message will be ignored!
butzi
Beiträge: 18
Registriert: Mo 02.Mai, 2005 21:56

Beitrag von butzi »

Na gut, dann muß ich mir das anders zurechtbasteln, trotzdem danke.
Gast

Beitrag von Gast »

Irgendwie habe ich mal ein Prog gesehen, was DHTM bzw JAVA Menüs macht. Muss mal schauen, ob ich das finde...
Antworten