Table-Menü

Links oben solltest Du nun ein kleines Menü sehen,
welches sich beim Anklicken öffnet.
Dieses Menü kann beliebig erweitert werden und
an die eigene Homepage angepasst werden. Es handelt sich dabei
um eine einfache Tabelle, die mit DHTML zu diesem Menü verändert wurde.

Die Positionsbestimmung wird ebenfalls mit DHTML gelöst und kann somit
exakt eingestellt werden.

Windows
Mac
Unix
BeOS

Work >>
Tools
Spiele >>

Star Office
Communicator
Photoshop Freehand

Tomb Raider
Quake
Swing

PC
Mac
Amiga
UNIX

HTML-Einbindung
   <style> .menu { position: absolute; top:0; z-index: 2; } .submenu { position: absolute; top: 22; z-index: 0; visibility: hide; visibility: hidden; } </style> <script>  </script> <div id="m1" class="menu" style="left: 5;"> <table bgcolor="000000" cellspacing="0" cellpadding="2" border="1" width="115"> <tr> <td><a href="javascript:do_menu('m1x')" onmouseover="do_check('m1x')"><b>Betriebssystem</b></a> </td> </tr> </table> </div><div id="m1x" class="submenu" style="left: 5;"> <table bgcolor="000000" cellspacing="0" cellpadding="2" border="1" width="115"> <tr> <td><a href="#">Windows</a><br> <a href="#">Mac</a><br> <a href="#">Unix</a><br> <a href="#">BeOS</a> </td> </tr> </table> </div><div id="m2" class="menu" style="left: 120;"> <table bgcolor="000000" cellspacing="0" cellpadding="2" border="1" width="100"> <tr> <td><a href="javascript:do_menu('m2x')" onmouseover="do_check('m2x')"><b>Software</b></a> </td> </tr> </table> </div><div id="m2x" class="submenu" style="left: 120;"> <table bgcolor="000000" cellspacing="0" cellpadding="2" border="1" width="100"> <tr> <td><a href="#" onmouseover="do_submenu('m21x')">Work</a> >><br> <a href="#" onmouseover="do_submenu()">Tools</a><br> <a href="#" onmouseover="do_submenu('m22x')">Spiele</a> >> </td> </tr> </table> </div><div id="m21x" class="submenu" style="left: 180; top:24; z-index:1;"> <table bgcolor="000000" cellspacing="0" cellpadding="2" border="1" width="100"> <tr> <td><a href="#">Star Office</a><br> <a href="#">Communicator</a><br> <a href="#">Photoshop</a> <a href="#">Freehand</a> </td> </tr> </table> </div><div id="m22x" class="submenu" style="left: 180; top:58; z-index:1;"> <table bgcolor="000000" cellspacing="0" cellpadding="2" border="1" width="100"> <tr> <td><a href="#">Tomb Raider</a><br> <a href="#">Quake</a><br> <a href="#">Swing</a> </td> </tr> </table> </div><div id="m3" class="menu" style="left: 220;"> <table bgcolor="000000" cellspacing="0" cellpadding="2" border="1" width="100"> <tr> <td><a href="javascript:do_menu('m3x')" onmouseover="do_check('m3x')"><b>Hardware</b></a> </td> </tr> </table> </div><div id="m3x" class="submenu" style="left: 220;"> <table bgcolor="000000" cellspacing="0" cellpadding="2" border="1" width="100"> <tr> <td><a href="#">PC</a><br> <a href="#">Mac</a><br> <a href="#">Amiga</a><br> <a href="#">UNIX</a> </td> </tr> </table> </div> </center>

Dieses Script per eMail? , einfach Deine eMail-Adresse eintragen und Sekunden später liegt es in Deinem Postfach.

Newsletter schon abonniert?
Wenn nicht, bitte "Haken" setzen