<div align="center">
<table border="0" width="100%">
<tr>
<td>
<style type="text/css" media="screen">
<!--
body
{
font-family: Verdana, sans-serif;
font-size: 14px;
overflow: auto;
padding: 10px;
margin: 0px;
}
ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}
li a
{
padding-right: 20px;padding-top: 5px;
}
div.menu
{
position: absolute;
z-index: 3;
top: 170px;
left: 50%;
margin-left:-350px;
width:150px;
}
.menu li
{
width: 150px;
float: left;
}
.menu a
{
border: 0px solid #000000;
background-color: #000000;
background-image: url(http://img.webme.com/pic/o/obscurus-production/buttonnewm.png);
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px 2px;
display: block;
height: 1px;
color: #FFFFFF;
}
.menu a:hover
{
background-color: #000000;
background-image: url();
}
#smenu1, #smenu2, #smenu3, #smenu4
{
font-size: 12px;
display: none;
width: 150px;
float: left;
}
#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a
{
font-weight: normal;
padding-top: 2px;
border-top: 0px;
cursor: pointer;
}
//-->
</style>
<script type="text/javascript">
<!--
function montre(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'block';
else if (all)
all[id].style.display = 'block';
else
layers[id].display = 'block';
}
}
function cache(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'none';
else if (all)
all[id].style.display = 'none';
else
layers[id].display = 'none';
}
}
//-->
</script>
</head>
<body>
<div class="menu">
<ul>
<li><a href="javascript:void(0);" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">Seitenname1</a>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
<li><a href="LINK ZUR SEITE">TITEL 1</a></li>
<li><a href="LINK ZUR SEITE">Unterseite1</a></li>
<li><a href="LINK ZUR SEITE">Unterseite2</a></li>
<li><a href="LINK ZUR SEITE">Unterseite3</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">Seitenname2</a>
<ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">
<li><a href="LINK ZUR SEITE">Unterseite1</a></li>
<li><a href="LINK ZUR SEITE">Unterseite2</a></li>
<li><a href="LINK ZUR SEITE">Unterseite3</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">Seitenname3</a>
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
<li><a href="LINK ZUR SEITE">Unterseite1</a></li>
<li><a href="LINK ZUR SEITE">Unterseite2</a></li>
<li><a href="LINK ZUR SEITE">Unterseite3</a></li>
<li><a href="LINK ZUR SEITE">Unterseite4</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu4');"
onmouseout="cache('smenu4');">Seitenname4</a>
<ul id="smenu4" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">
<li><a href="LINK ZUR SEITE">Unterseite1</a></li>
<li><a href="LINK ZUR SEITE">Unterseite2</a></li>
</ul>
</li>
</ul>
</div>
</body>
</html>
<style type="text/css">
<!--
td.edit_rechts_sbg{visibility:hidden;}
td.sidebar_heading{
background-image: url();
background-color: #transparent;
border-bottom: 0px double #transparent;}
.shouty, .shouty2, .shouty3, .shouty4, .shouty5{
background-image: url();
position:
top: 180px ;
background-color: #000000;
color: #000000;
font-weight: bold;}
td.headline{visibility:hidden;}
td.headline2{visibility:hidden;}
td.idcp{visibility:hidden;}
td.edit_rb_footer{
background-image: url();
background-color: #transparent;
border-bottom: 0px solid #transparent;}
td.edit_rechts_bottom{
background-image: url();
background-color: #transparent;}
td.edit_content_top{visibility:hidden;}
td.edit_rechts_cbg{
margin: 0px;
background-image: url();
background-color: #transparent;}
td.edit_content{background-image:url(); background-color:#000000;filter:
alpha(opacity=80);-moz-opacity:0.80;opacity:0.80;width: 80% !important; }
table.edit_main_table{width: 100% !important;}
td.edit_main_tr{width: 100% !important;}
table.edit_second_table{width: 100% !important;}
td.edit_header_full{width: 100% !important;}
td.edit_header_full table{width: 100% !important;}
table.edit_third_table{width: 100% !important;}
td.edit_navi_headbg{width: 20% !important;}
table.edit_rechts_tabelle{width: 100% !important;}
td.edit_rechts_bottom{width: 20% !important;}
td.edit_rechts_cbg{width:100%;}
body{
background-image: url(http://www.pic-upload.de/05.01.09/22z5y.jpg);background-repeat:no-repeat
;background-attachment: fixed;
background-color: #transparent;
color: #transparent !important;}
td.edit_header_full{
width: 100% !important;
background-repeat:no-repeat;
background-position:center center;
background-image: url(http://www.pic-upload.de/05.01.09/xil7y4.png);}
td.nav{
text-decoration: none;
color: #transparent;
width: 150px;
height: 35px;
background-image: url(http://www.pic-upload.de/05.01.09/fdvvoh.jpg);}
td.nav:hover{
color: #transparent;
width: 150px;
height: 35px;
background-image: url(http://www.pic-upload.de/05.01.09/rtuil2.gif);}
td.edit_navi_headbg{
margin: 0px;
padding: 0px;
background-image: url();
background-color: #transparent;
width: 150px;
background-repeat: repeat-y;}
td.edit_below_nav{
visibility: hidden;
width: 150px;}
td.edit_below_nav img{
visibility: hidden;
width: 1px;}
td.nav_heading{
width: 150px;
height: 1px;
background-image: url();
background-color: #transparent;
padding-top: 0px;
font-weight: bold;
font-size: 15px;
text-decoration: none;}
td.edit_navi_headbg table{
width: 0px;}
td.edit_content_bottom{
background-image: url();
background-color: #transparent;
text-align: right;}
td.edit_content_bottom2{
background-image: url();
background-color: #transparent;
text-align: right;}
-->
</style>
die Idee hatte ich (Natürlich) auch schon , jedoch ist letztendlich die fragen : "welche ?" 