Menü készítése (css és html) | Fórum!

Evia (2017-11-24 09:56) [Bejegyzés megtekintése]

Kinyíló menü

Talán emlékeztek rá, hogy korábban ez a honlap másképpen nézett ki. A színeiben hasonlított a mostanira, de az elrendezése (szerintem) zsúfoltabb volt, így kevésbé lehetett átlátni. A fotóalbumban 10-15 fejezet, a fejezetekben pedig legalább 10-20 kategória. Akkor az volt a célom, hogy az oldalsávból mindig, minden helyről el lehessen érni az összes kategóriát. Ehhez függőleges, úgynevezett "kinyíló" menüt használtam, amelynek az a lényege, hogy ha rákattintunk a menüpontra, megjelennek az almenüi (ha rákattintunk a fotóalbum valamelyik fejezetének a nevére, megjelennek az ahhoz tartozó kategóriák). Ezt a módszert már nem használom, de mivel érdekes és látványos, szeretném veletek megosztani.

A html forrásban egy tetszőleges helyen kell ezt a kódot elhelyezni:

Kód

A szkriptet pedig valahogy így használjuk fel:

Kód

<a href="javascript:viewMore('mymenu1');" id="xmymenu1">Külső menü</a>
<div id="mymenu1" style="display:none">
   <table>
   <tr>
   <td style="width:100%" class="me3" valign="top">
   <a href="/mysite1" target="_blank" class="cn3">Belső menü 1</a>
   </td>
   </tr>
   <tr>
   <td style="width:100%" class="me3" valign="top">
   <a href="/mysite2" target="_blank" class="cn3">Belső menü 2</a>
   </td>
   </tr>
   <tr>
   <td style="width:100%" class="me3" valign="top">
   <a href="/mysite2" target="_blank" class="cn3">Belső menü 3</a>
   </td>
   </tr>
   </table>
</div>