Modyfikacja menu na rozwijane.

wersja skryptu MyBB: 1.6.11
adres forum: www.wl-hb.xaa.pl
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu):

Chciałbym zmodyfikować swoje menu w stylu tak, aby jeden panel po prostu był rozwijany np. nowe tematy (abym mógł tam dodać swoje podstrony), ale aby nie zmieniać wyglądu itd .

header

<style type="text/css">.show_hide {display:none;}</style>
<script type="text/javascript">
var opt_menu = jQuery.noConflict();
opt_menu(document).ready(function(){
        opt_menu(".member").hide();
        opt_menu(".show_hide").show();
    opt_menu('.show_hide').click(function(){
    opt_menu(".member").slideToggle();
});
});
</script>

<div class="menu">
<ul>


<span class="pm"><a class="pms" href="{$mybb->settings['bburl']}/private.php">{$mybb->user['unreadpms']}</a></span>


  <li><a href="{$mybb->settings['bburl']}"><img style="top: 13px; left: 4px;" src="images/extras-dark/btn-home.png"></a></li>
  <li><a href="{$mybb->settings['bburl']}/usercp.php">{$mybb->user['username']}</a></li>
  <li><a href="{$mybb->settings['bburl']}/search.php?action=getnew">Nowe Posty</a></li>
  <li><a href="{$mybb->settings['bburl']}/search.php?action=getdaily">Dzisiejsze Posty</a></li>
  <li><a href="search.php?action=finduserthreads&uid={$mybb->user['uid']}">Twoje Tematy</a></li>
  <li><a href="{$mybb->settings['bburl']}/private.php" title="{$lang->welcome_pms_usage}">Wiadomości</a></li>
  <!--<li><a href="{$mybb->settings['bburl']}/misc.php?action=mychat" title="Shoutbox">Shoutbox ()</a></li>-->

  <span style="float:right;">
  <li class="rt"><a href="{$mybb->settings['bburl']}/search.php"><img style="top: 14px;left:3px;" src="images/extras-dark/btn-search.png"></a></li>
  <li class="rtm"><a href="#" class="show_hide"><img style="top: 14px;left:3px;" src="images/extras-dark/options.png"></a></li>
  <li class="rtt"><a href="{$mybb->settings['bburl']}/member.php?action=logout&amp;logoutkey={$mybb->user['logoutkey']}" title="Logout"><img style="top: 13px;left:3px;" src="images/extras-dark/btn-off.png"></a></li>
  </span>

</ul>
</div>
    
<div class="member">
<span style="float:left;">Witaj ponownie, {$mybb->user['username']} !!</span>
<span style="float:right;">
<a class="btns" href="{$mybb->settings['bburl']}/memberlist.php">Użytkownicy</a>
<a class="btns" href="{$mybb->settings['bburl']}/usercp.php">Panel Użytkownika</a>
{$modcplink}{$admincplink}

</span>
<div style="clear:both;"></div>
</div>

global.css

.menu ul {
  background-color:#4a6300;
  background-image:url(images/extras-dark/menuIMG.png);
  background-position:0 -2px;
  background-repeat:repeat no-repeat;
  border-left: 1px solid #160101;
  border-right: 1px solid #160101;
  color:#bdbcbc;
  font-size:12px;
  font-weight:bold;
  height:43px;
  line-height:43px;
  padding:0;
  text-align:left;
}

.menu ul a {
  border-right-color:#22290e;
  border-right-style:solid;
  border-right-width:1px;
  box-shadow:rgba(255, 255, 255, 0.0470588) 1px 0 0;
  color: #bdbcbc;
  display:block;
  font-size:10px;
  height:43px;
  line-height:43px;
  padding:0 12px;
  text-shadow: #253301 0px 1px;
  text-transform:uppercase;
}

.menu ul a:visited {
  color: #bdbcbc;
  text-decoration: none;
}

.menu ul a:hover, .menu ul a:active {
  background-color:transparent;
  background-image:url(images/extras-dark/menuIMG-over.png);
  background-position:0 -2px;
  background-repeat:repeat repeat;
  box-shadow:#000000 0 0 1px inset;
  color: #bdbcbc;
  text-decoration:none;
}

.menu ul li.rt a{
  border-left-color:#22290e;
  border-left-style:solid;
  border-left-width:1px;
  box-shadow:rgba(255, 255, 255, 0.0470588) 1px 0 0;
  color: #bdbcbc;
  display:block;
  font-size:10px;
  height:43px;
  line-height:43px;
  padding:0 px;
  text-shadow: #253301 0px 1px;
  text-transform:uppercase;
  float: right;
}
.menu ul li.rtt a{
  float: right;
  border:none;
}
.menu ul li.rtm a{
  float: right;
  border-right-color:#22290e;
  border-right-style:solid;
  border-right-width:1px;
}

Weźmy na przykład: http://www.noupe.com/css/100-great-css-m...rials.html wybierz sobie coś, Odpowiednio <li> z tymi postami</li> przerób i dodaj CSS. To wszystko.