SELFHTML Forum
SELFHTML Forumsarchiv
2007
Oktober
 |
SELFHTML Forumsarchiv |
 |
|
 |
|
Die folgende Nachricht zum Thema stammt von: Wende, 30. 10. 2007, 15:55
Hallo,
folgendes Problem: bei dem unten stehenden Menü öffnet sich zwar das Untermenü immer schön neben dem Hauptmenü, allerdings immer einen Menüpunkt zu weit unten. Wie kann ich das hochziehen?
Danke für jede Hilfe,
Wende
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta http-equiv="content-script-type" content="text/javascript">
<meta http-equiv="content-style-type" content="text/css">
<title>Foldoutmenue Horizontal</title>
<style type="text/css" media="screen">
<!--
body
{
font-family: Verdana, sans-serif;
font-size: 12px;
overflow: auto;
padding: 10px;
margin: 0px;
}
ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}
.menu
{
position: absolute;
z-index: 3;
top: 10px;
}
.menu li
{
width: 140px;
}
.menu a
{
border: 5;
background-color: #EFCC05;
text-decoration: none;
text-align: left;
font-weight: bold;
cursor: default;
margin: 0px 0px;
display: block;
height: 20px;
color: #00004A;
}
.menu a:hover
{
background-color: #FF0000;
}
#smenu1, #smenu2, #smenu3, #smenu4
{
font-size: 12px;
display: none;
width: 140px;
left: 140px;
position: absolute;
}
#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');">Menu 1</a>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
<li><a href="">Subkategorie 1.1</a></li>
<li><a href="">Subkategorie 1.2</a></li>
<li><a href="">Subkategorie 1.3</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">Menu 2</a>
<ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">
<li><a href="">Subkategorie 2.1</a></li>
<li><a href="">Subkategorie 2.2</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">Menu 3</a>
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
<li><a href="">Subkategorie 3.1</a></li>
<li><a href="">Subkategorie 3.2</a></li>
<li><a href="">Subkategorie 3.3</a></li>
<li><a href="">Subkategorie 3.4</a></li>
<li><a href="">Subkategorie 3.5</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">Menu 4</a>
<ul id="smenu4" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">
<li><a href="">Subkategorie 4.1</a></li>
<li><a href="">Subkategorie 4.2</a></li>
<li><a href="">Subkategorie 4.3</a></li>
</ul>
</li>
</ul>
</div>
</body>
</html>
Die folgende Nachricht zum Thema stammt von: David, 30. 10. 2007, 16:12
»» folgendes Problem: bei dem unten stehenden Menü öffnet sich zwar das Untermenü immer schön neben dem Hauptmenü, allerdings immer einen Menüpunkt zu weit unten. Wie kann ich das hochziehen?
Da hast Du Dir ja schön Code irgendwo rauskopiert ;-)
Quick & Dirty: Trage in die CSS-Klasse für die Submenüs einfach ein margin-top:-20px; ein. Also:
#smenu1, #smenu2, #smenu3, #smenu4
{
font-size: 12px;
display: none;
width: 140px;
left: 140px;
margin-top:-20px;
position: absolute;
}
Dann geht es.
Die folgende Nachricht zum Thema stammt von: Wende, 30. 10. 2007, 16:14
»» Da hast Du Dir ja schön Code irgendwo rauskopiert ;-)
Stimmt!^^
Danke, super! Jetzt geht wieder alles optimal!
© 1998-2006 
Impressum, Software: Classic Forum
(CSS)