Hallo,
ich habe links eine Menueleiste seitlich wegklappbar erstellt. Wenn sich die Menüleiste aufklappt, wird die Menüleiste in den Bereichen wo sich der Seiten Inhalt befindet abgedeckt. Wie kann ich den Seiteninhalt (Layer) in den Hintergrund stellen. Unten habe ich den Quellcode beigefügt. Bitte kann mir Jemand helfen? Besten Dank im Voraus.
Liebe Grüße
nuay
<script type="text/javascript" src="dhtml.js"></script>
<img src="Bilder/menue_balken.gif" width="100" height="20" />
<script type="text/javascript">
function Menue () {
if (typeof window.pageYOffset == "number") {
if (NS4) {
getElement("id", "Nav").top = window.pageYOffset + 200;
} else {
getElement("id", "Nav").style.top = window.pageYOffset + 200;
}
} else {
if (typeof document.body.scrollTop == "number")
getElement("id", "Nav").style.top = document.body.scrollTop + 200;
}
if (OP)
getElement("id", "NavLinks").style.pixelTop = NavLinksPos;
if (NS4) {
getElement("id", "Nav").visibility = "show";
} else {
getElement("id", "Nav").style.visibility = "visible";
}
}
function noMenue () {
if (NS4) {
getElement("id", "Nav").visibility = "hide";
} else {
getElement("id", "Nav").style.visibility = "hidden";
}
}
function handleMove (ev) {
if (!ev)
ev = window.event;
var mausposition = ev.pageX ? ev.pageX : ev.clientX;
if (mausposition < 200) {
Menue();
} else {
if (mausposition > 220) {
noMenue();
}
}
}
function Event_init () {
if (document.addEventListener) {
document.addEventListener("mousemove", handleMove, true);
} else {
if (NS4) {
document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = handleMove;
} else {
document.body.onmousemove = handleMove;
}
}
if (OP) {
NavLinksPos = 42; // Position des Bereiches NavLinks
getElement("id", "NavLinks").style.pixelTop = NavLinksPos;
}
}
</script>
<style type="text/css">
body { color:black; background-color:white; background-image:url(navigation_back.gif);
margin:0; padding:20px 50px; font-family:Arial,sans-serif; }
#Nav { position:absolute; top:50px; left:0; visibility:hidden; }
#NavLinks { position:absolute; top:42px; left:42px; }
#Nav a:link {color:#006699; font-weight:solid; font-size:14px; text-decoration:none; }
#Nav a:visited { color:#006699; font-weight:solid; font-size:14px; text-decoration:none; }
#Nav a:hover { color:#006699; background-color:#E1DDE0; font-weight:solid;
font-size:14px; text-decoration:none; }
#Nav a:active { color:#FF6600; font-weight:solid; font-size:14px; text-decoration:none; }
</style>
<div id="Nav">
<p> </p>
<div id="navBar">
<div id="sectionLinks">
<ul>
<li><a href="home.htm">Home</a><a href="produkte.htm">Produkte</a></li>
</ul>
<menu>
<ul><li><a href="dm_bohrmaschinen.htm">EDM-Bohren</a>
</li>
<menu> <li><a href="dm_bohr_manuel.htm">manuell </a></li>
<li><a href="edm_bohr_gesteuert.htm">gesteuert</a></li>
</menu>
<li><a href="senkerodiermaschine_manuell.htm">Senkerodieren</a></li>
<menu>
<li><a href="senkerodiermaschine_manuell.htm">manuell </a></li>
<li><a href="senkerodiermaschine_gesteuert.htm">gesteuert</a></li>
</menu>
<li><a href="#">Drahtschneiden <span class="Stil22"><></span></a></li>
<li><a href="gebraucht.htm">Gebraucht</a></li>
<li><a href="zubehoer.htm">Zubehör</a></li>
<menu>
<li><a href="zubehoer_edm_bohr.htm">EDM Bohren </a></li>
<li><a href="zubehoer_senkerosion.htm">Senk- u. Draht </a></li>
<li><a href="werkzeugbau.htm">Werkzeugbau</a></li>
</menu>
<li><a href="roehrchen_zubehoer_bestellen.htm">Röhrchen bestellen </a></li>
</ul>
</menu>
<p><a href="partner.htm">Partner</a><a href="messen.htm">Messen</a><a href="downloads.htm">Downloads</a><a href="kontakt.htm">Kontakt</a><a href="impressum.htm">Impressum</a></p>
</div>
</div>