Hallo,
Ich habe eine dynamische Navigation.
Bisher hat es die anderen Elemente nach unten verschoben, wenn die dynamik etwas ausklappte.
doch jetzt soll das ausgeklappte "über" der normalen navigation sein.
Dass die anderen elemente nicht nach unten gehen, habe ich mit "position:absolute;" schon geschafft.
Doch die dynamik bleibt im hintergrund...
Wie behebe ich das Problem?
PC FREAKY
Ich habe eine dynamische Navigation.
Bisher hat es die anderen Elemente nach unten verschoben, wenn die dynamik etwas ausklappte.
doch jetzt soll das ausgeklappte "über" der normalen navigation sein.
Dass die anderen elemente nicht nach unten gehen, habe ich mit "position:absolute;" schon geschafft.
Doch die dynamik bleibt im hintergrund...
Wie behebe ich das Problem?
PHP:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<LINK REL="SHORTCUT ICON" HREF="favicon.ico">
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("a:contains('UltraVNC Installieren')").click(function()
{
$("#main").load("installieren.htm");
});
$("a:contains('IP-Adresse herausfinden')").click(function()
{
$("#main").load("ip-adresse.htm");
});
$("a:contains('UltraVNC Deinstallieren')").click(function()
{
$("#main").load("deinstallieren.htm");
});
});
</script>
<!--[if IE]>
<style type="text/css" media="screen">
#menu ul li {float: left; width: 100%;}
</style>
<![endif]-->
<!--[if lt IE 7]>
<style type="text/css" media="screen">
body {behavior: url(csshover.htc); font-size: 100%;}
#menu ul li a {height: 1%;}
}
</style>
<![endif]-->
<!-- InstanceBeginEditable name="doctitle" -->
<title></title>
<meta name="author" content="Graudy">
<!-- InstanceEndEditable --><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
/* grundlegende Seiteneinstellungen*/
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background-image:url(hintergrund2.png);
background-repeat:repeat;
}
h1,h2,h3 {
font-family: "Times New Roman", "Trebuchet MS", Georgia, serif;
font-weight:normal;
color:#000000;
}
h1 {
font-size: 330%;
}
h2 {
font-size: 250%;
}
h3 {
font-size: 150%;
margin-bottom:1em;
}
a:link { color:black; text-decoration:underline; }
a:visited { color:black; text-decoration:underline; }
a:hover { color:black; text-decoration:underline; }
a:active { color:black; text-decoration:underline; }
a.otherLink:link { color:0; text-decoration:none; }
a.otherLink:visited { color:0; text-decoration:none; }
a.otherLink:hover { color:0; text-decoration:underline; }
a.otherLink:active { color:0; text-decoration:none; }
a img {border:none; }
-->
</style>
<!-- InstanceBeginEditable name="head" -->
<style type="text/css">
<!--
#main {
float:left;
position:absolute;
margin-top:200px;
padding:0;
width:910px;
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius: 10px;
}
#logo {
float:left;
}
-->
</style>
<style type="text/css">
ul#Navigation {
width: 10em;
margin: 0; padding: 0.8em;
border: 1px solid black;
background-color: silver;
margin-top:200px;
}
* html ul#Navigation { /* Korrekturen fuer IE 5.x */
width: 11.6em;
w\idth: 10em;
padding-left: 0;
padd\ing-left: 0.8em;
}
ul#Navigation li {
list-style: none;
margin: 0.4em; padding: 0;
position:relative;
}
ul#Navigation li ul {
margin: 0 0 0 0.5em;
padding: 0;
}
ul#Navigation li ul li {
margin: 0.1em 0;
}
* html ul#Navigation li ul li { /* Korrektur fuer IE 5.x */
margin-left: 1em;
ma\rgin-left: 0;
}
ul#Navigation a {
display:block;
padding: 0.2em;
text-decoration: none; font-weight: bold;
border: 1px solid black;
border-left-color: white; border-top-color: white;
color: black; background-color: #ccc;
}
* html ul#Navigation a {
width: 100%; /* Breitenangabe fuer IE 5.x */
w\idth: 8.8em; /* Breitenangabe fuer IE 6 */
}
* html ul#Navigation li ul li a {
width: 100%; /* Breitenangabe fuer IE 5.x */
w\idth: 7.8em; /* Breitenangabe fuer IE 6 */
}
ul#Navigation a:hover {
border-color: white;
border-left-color: black; border-top-color: black;
color: white; background-color: gray;
}
/* Erweiterung zur dynamischen Ein-/Ausblendung */
ul#Navigation li>ul {
display: none; top: 1.6em;
position:absolute;
}
ul#Navigation li:hover>ul, ul#Navigation li>a#aktuell+ul {
display: block;
}
/* Workaround fuer den IE 7 */
*:first-child+html ul#Navigation ul {
background-color:silver; padding-bottom:0.4em;
}
</style>
<!-- InstanceEndEditable -->
</head>
<div id="Rahmen"><ul id="Navigation">
<li><a href="#">Hilfeprogramm</a>
<ul>
<li><a href="#">UltraVNC Installieren</a></li>
<li><a href="#">UltraVNC Deinstallieren</a></li>
<li><a href="#">IP-Adresse herausfinden</a></li>
</ul>
</li>
<li><a href="#">Seisfdfste 2</a>
<ul>
<li><a href="#">Sedfdaite 2a</a></li>
<li><a href="#">Sedfasdfite 2b</a></li>
</ul>
</li>
<li><a href="#">Seasdfite 3</a></li>
<li><a href="#">Seisdfasdfasdfaste 4</a>
<ul>
<li><a href="#">Sesdfite 4a</a></li>
<li><a href="#">Seiasfasdfasdfasdfte 4b</a></li>
<li><a href="#">Seiasdffddfasdfasddfasdfasffte 4c</a></li>
</ul>
</li>
<li><a href="#">Sedfasdfad</a></li>
</ul><div></div>
<div id="main"><font size="4">
</body>
</html>PC FREAKY
