Rozwijane menu - styl deflection

wersja skryptu MyBB: 1.6.9
adres forum: http://cs-leszno.eu
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu): Witam, szybko i na temat, poszukuję jakiegoś kodu/skryptu, czegokolwiek na rozwijane menu tak jak na ss poniżej. Forum z ss poniżej jest na skrypcie IP Board, ale może to nie jest wielką przeszkodą dla was. Forum poniżej jak i moje jest bazowane na stylu Deflection.



Forum z ss: http://www.mytylkogramy.com/

Chcę by menu u mnie się rozwijało, znaczy się, któraś zakładka np. dodam sobię Inne i po kliknięciu albo najechaniu na nią rozwija się identyczna/podobna lista. Za każdą pomoc plusik. Dzięki i Pozdrawiam - Awil.

Tego w sieci jest masa; dosłownie.

najprostszy

<style type="text/css">
* {margin: 0; padding: 0;}
#test li {list-style: none;}
#test {height: 30px;}
#test ul {visibility: hidden; position: absolute; top: 100%; left: 0;}
#test li {float: left; padding-right: 1px; position: relative;}
#test li li {float: none; padding-top: 1px; width: 160px;}
#test li:hover ul {visibility: visible;}
#test a, #menu li:hover li a {display: block; font: 12px/30px verdana, sans-serif; text-decoration: none; padding: 0 10px; color: #fff; background-color: #666;}
#test li li a {width: 140px;}
#test li:hover a, #menu li:hover li:hover a {background-color: #333095;}
</style>
<ul id="test">
  <li><a href="#">Link 1</a>
    <ul>
      <li><a href="#">Link 1.1</a></li>
      <li><a href="#">Link 1.2</a></li>
      <li><a href="#">Link 1.3</a></li>
    </ul>
  </li>
  <li><a href="#">Link 2</a>
    <ul>
      <li><a href="#">Link 2.1</a></li>
      <li><a href="#">Link 2.2</a></li>
      <li><a href="#">Link 2.3</a></li>
    </ul>
  </li>
  <li><a href="#">Link 3</a>
    <ul>
      <li><a href="#">Link 3.1</a></li>
      <li><a href="#">Link 3.2</a></li>
      <li><a href="#">Link 3.3</a></li>
    </ul>
  </li>
</ul> 


lub coś takiego
http://www.dynamicdrive.com/dynamicindex...chmenu.htm
http://webroad.pl/html5-css3/10-rozwijan...oziome-css i wiele wiele, wiele więcej...

Tego w sieci jest masa; dosłownie.

najprostszy

<style type="text/css">
* {margin: 0; padding: 0;}
#test li {list-style: none;}
#test {height: 30px;}
#test ul {visibility: hidden; position: absolute; top: 100%; left: 0;}
#test li {float: left; padding-right: 1px; position: relative;}
#test li li {float: none; padding-top: 1px; width: 160px;}
#test li:hover ul {visibility: visible;}
#test a, #menu li:hover li a {display: block; font: 12px/30px verdana, sans-serif; text-decoration: none; padding: 0 10px; color: #fff; background-color: #666;}
#test li li a {width: 140px;}
#test li:hover a, #menu li:hover li:hover a {background-color: #333095;}
</style>
<ul id="test">
  <li><a href="#">Link 1</a>
    <ul>
      <li><a href="#">Link 1.1</a></li>
      <li><a href="#">Link 1.2</a></li>
      <li><a href="#">Link 1.3</a></li>
    </ul>
  </li>
  <li><a href="#">Link 2</a>
    <ul>
      <li><a href="#">Link 2.1</a></li>
      <li><a href="#">Link 2.2</a></li>
      <li><a href="#">Link 2.3</a></li>
    </ul>
  </li>
  <li><a href="#">Link 3</a>
    <ul>
      <li><a href="#">Link 3.1</a></li>
      <li><a href="#">Link 3.2</a></li>
      <li><a href="#">Link 3.3</a></li>
    </ul>
  </li>
</ul> 


lub coś takiego
http://www.dynamicdrive.com/dynamicindex...chmenu.htm
http://webroad.pl/html5-css3/10-rozwijan...oziome-css i wiele wiele, wiele więcej...

Ten 1 sposób jest najlepszy, ale mógłbyś mi pomóc to jakoś ogarnąć? By było to menu w o takim samym buttonie i żeby było ładnie umieszczone w nawigacji?

header:

<div id="main_wrapper">
<div id="boxes">
<div id="loginbox" class="window login_menu">
<div class="loginbox_content">
<div class="loginbox_head powiekszacz">
&nbsp; &nbsp; Logowanie
<span><a href="#" class="close pmpopup" title="Zamknij okno.">X</a></span>
</div>
<form autocomplete="off" method="post" id="signin" action="member.php">
<input name="action" type="hidden" value="do_login">
<input name="url" type="hidden" value="{$mybb->settings['bburl']}">
<input name="quick_login" type="hidden" value="1">
<table cellspacing="0" cellpadding="0">
<tr>
<td width="5%" style="padding:8px;">
<span style="color: #bcbcbc; font: normal 13px tahoma,helvetica,arial,sans-serif;">
<b>Nazwa użytkownika</b>
</span>
<span class="right" style="color: #898989; font: normal 11px tahoma,helvetica,arial,sans-serif;">
<a href="{$mybb->settings['bburl']}/member.php?action=register" style="color: #898989;">Zarejestruj się!</a>
</span></td>
<td width="5%" style="padding:8px;"><span style="color: #bcbcbc; font: normal 13px tahoma,helvetica,arial,sans-serif;">
<b>Hasło forum</b></span>    
<span class="right" style="color: #898989; font: normal 11px tahoma,helvetica,arial,sans-serif;"><a href="{$mybb->settings['bburl']}/member.php?action=lostpw" style="color: #898989;">Zapomniałem hasła</a></span></td></tr>
<tr><td width="5%" style="padding:8px;">
<center><input id="quick_login_username" name="quick_username" value="" title="username" tabindex="4" type="text">
</center></td>
<td width="5%" style="padding:8px;">
<center>
<input id="quick_login_password" name="quick_password" value="" title="password" tabindex="5" type="password">
</center></td></tr>
<tr>
<td width="5%" style="border-bottom: 1px solid #111111;"></td>
<td width="5%" style="border-bottom: 1px solid #111111;"></td>
</tr><tr><td width="5%" style="border-bottom: 1px solid #252525;">
</td><td width="5%" style="border-bottom: 1px solid #252525;"></td></tr>
<tr><td width="5%" style="padding:8px;">
<input name="quick_remember" id="quick_login_remember" type="checkbox" value="yes" class="checkbox" checked="checked">
 <span style="color: #bcbcbc; font: normal 12px tahoma,helvetica,arial,sans-serif;">Zapamiętaj mnie</span>
<br>
Niepolecane dla współdzielonych komputerów</td>
<td width="5%" style="padding:8px;">
<center></center></td></tr>
<tr><td width="5%" style="border-bottom: 1px solid #111111;"></td>
<td width="5%" style="border-bottom: 1px solid #111111;"></td></tr>    </table>
<div style="padding:13px;">
<center>
<span style="text-align: center; color: #fff; font: normal 12px tahoma,helvetica,arial,sans-serif;">
Polityka Prywatnosci
</span>
</center>
</div>
<div class="loginbox_head">
<center>

<input id="buuttonynowe" name="submit" type="submit" value="Zaloguj">

</center></div></form></div></div></div>
<div id="mask"></div></div>
<a name="top" id="top"></a>

<div id="main_wrapper">
<div id="boxes">
<div id="info" class="window login_menu">
<div class="loginbox_content">
<div class="loginbox_head powiekszacz">
&nbsp; &nbsp; Informacje
<span><a href="#" class="close pmpopup" title="Zamknij okno.">X</a></span>
</div>
<form autocomplete="off" method="post" id="signin" action="member.php">
<input name="action" type="hidden" value="do_login">
<input name="url" type="hidden" value="{$mybb->settings['bburl']}">
<input name="quick_login" type="hidden" value="1">
<table cellspacing="0" cellpadding="0">
<td>
<tr>
<td colspan="2" class="tcat"><strong>Statystyki Forum</strong></td>
</tr>
<tr>
<td class="userprofile_trow"><strong>Wszystkich tematów</strong></td>
<td class="userprofile_trow"> <span class="statround">1</span></td>
</tr>
<tr>
<td class="userprofile_trow"><strong>Wszystkich postów</strong></td>
<td class="userprofile_trow"> <span class="statround">2</span> </td>
</tr>
<tr>
<td class="userprofile_trow"><strong>Wszystkich użytkowników </strong></td>
<td class="userprofile_trow"> <span class="statround">4</span> </td>
</tr>
<tr>
<td class="userprofile_trow"><strong>Najnowszy użytkownik</strong></td>
<td class="userprofile_trow"> <span class="statround">123123</span> </td>
</tr>
<tr>
<td colspan="2" class="tcat"><strong>Przydatne linki</strong></td>
</tr>

<tr>
<td class="userprofile_trow"><strong>
<a href="search.php?action=getnew">Wyświetl nową zawartość</a></strong>
<td class="userprofile_trow"></td>
</td>
</tr>
<tr>
<td class="userprofile_trow"><strong>
<a href="stats.php">Statystyki</a></strong>
</td>
</tr>
<tr>
<td class="userprofile_trow"><strong>
<a href="showteam.php">Ekipa Forum</a></strong>
</td>
</tr>    
<tr>
<td class="userprofile_trow"><strong>
<a href="online.php">Aktywni użytkownicy</a></strong>
</td>
</tr>
<tr>
<td class="userprofile_trow"><strong>
<a href="memberlist.php">Zarejestrowani użytkownicy</a></strong>
</td>
</tr>
<td colspan="2" class="tcat"><strong>Dodatkowe informacje</strong></td>
</tr>
<tr>
<td class="userprofile_trow"><strong></strong></td>
<td class="userprofile_trow"></td>
</tr>
</table>
</td>
</form></div></div></div>
<div id="mask"></div></div>
<a name="top" id="top"></a>


<div class="szerokosc_all">
{$modcplink}
<div id='nav_wrap'>
<span class="right" style="padding-top: 5px;">
<div id="search" class="right">
<form action="search.php" method="post" id='search-box'>
<span id='search_wrap'>
<input type="text" class="text_input" id='main_search' name="keywords" onfocus="this.value = '';" value="Wyszukiwanie..." size='30' tabindex='6' />
<input type="hidden" name="action" value="do_search" />
<input type="hidden" name="forums" value="all" />
<input type="hidden" name="postthread" value="1" />
</span>
<div  id='forum_search'> .</div>
<input type='submit' class='submit_input clickable' value="Search" this.value='';" />
<a href="http://localhost/~demo/search.php" id='adv_search'>Zaawansowane</a>
</form>
</div>
</span>

</div>


<img src="http://www.cs-leszno.xaa.pl/images/deflection/logo.png" style="opacity: 1;" onmouseover="this.style.opacity=0.8;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=1;this.filters.alpha.opacity=40">
</div>

    <div id="menu_logowania">
    <div class="szerokosc_all">
        <ul id="menu1">
        <li {$index_active}><a  href="{$mybb->settings['bburl']}/index.php">Forum</a></li>
        <li {$members_active}><a  href="{$mybb->settings['bburl']}/memberlist.php">Użytkownicy</a></li>
        <li {$search_active}><a  href="{$mybb->settings['bburl']}/search.php">Szukaj</a></li>
        <li {$calendar_active}><a href="http://295618.hltv1.pukawka.pl">HLTV DD2</a></li>
                <li {$misc_active}><a href="http://294329.hltv1.pukawka.pl">HLTV COD</a></li>
        <li {$misc_active}><a href="http://cs-leszno.eu/amxbans/ban_list.php">AMXBANS</a></li>
        </ul>
<span class="right";">
{$welcomeblock}
</span>
    </div>
</div>
<br>
<div class="szerokosc_all">
<navigation>
</div>
<div id="content">

<div id="choinka"></div> 
<div id="gift"></div> 


---

Dobra, zalukałem o co chodzi, jednak dobry sen dobrze robi xd.

Nawigacja się rozwalała, bo musiałem obecne butony (<li>.....</li>) itp. Przebudować na tą od tych rozsuwanych. Dzięki.