06.07.2010, 16:11
Hallo liebe Forum,
ich bin keiner Programmiere, aber ich habe versucht so ein Art Dynamische Navigationsleiste mit zu schreiben und das hat auch geklappt. Allerdings habe ich ein kleines Problem. Das Geschwindichkeit von der Menus finde ich zu hoch! Wenn ich auf irgendwas klicke geht alles auf aber es ist sehr schnell.. ich weiß es nicht wie ich mein Problem beschreiben kann aufjedenfall kann ich nur sagen dass meine Liste sehr schnell ist und ich kann nicht z.B von Komponente -> 2. Buch auf Bearbeitung gehen!?
Kann jemand mir vielleicht weiter helfen?
Ich kopiere hier mein Q-Code rein!
Danke + Gruß
Timo
ich bin keiner Programmiere, aber ich habe versucht so ein Art Dynamische Navigationsleiste mit zu schreiben und das hat auch geklappt. Allerdings habe ich ein kleines Problem. Das Geschwindichkeit von der Menus finde ich zu hoch! Wenn ich auf irgendwas klicke geht alles auf aber es ist sehr schnell.. ich weiß es nicht wie ich mein Problem beschreiben kann aufjedenfall kann ich nur sagen dass meine Liste sehr schnell ist und ich kann nicht z.B von Komponente -> 2. Buch auf Bearbeitung gehen!?
Kann jemand mir vielleicht weiter helfen?
Ich kopiere hier mein Q-Code rein!
Danke + Gruß
Timo
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta name="ROBOTS" content="NOINDEX, NOFOLLOW">
<TITLE>TestMeister</TITLE>
<link href="stylesheets/common.css" type="text/css" rel="stylesheet">
<script type="text/javascript">
function einblenden() {
this.className="hoverIE"; this.firstChild.className="hoverIE";
}
function ausblenden() {
this.className=""; this.firstChild.className="";
}
</script>
<style type="text/css">
ul#Navigation {
margin: 0; padding: 0;
}
/* dynamisches Ein-/Ausblenden wenn möglich kann man weg machen*/
ul#Navigation li ul {
display: none;
}
/* dynamisches Ein-/Ausblenden */
ul#Navigation li:hover>ul {
display: block;
}
/* dynamisches Ein-/Ausblenden der JavaScript-generierten Klasse im IE */
* html ul#Navigation li.hoverIE {
margin-right:0; /* reservierten Platz freigeben */
margin-bottom:-3.15em; /* Fehlerkorrektur, ggfls. anpassen */
}
* html ul#Navigation li.hoverIE ul {
display: block;
}
* html ul#Navigation li .hoverIE {
width: 10.3em;
w\idth: 8.2em; /* (IE 6 in standards-compliant mode) */
background: #e00 url(pfeil.gif) no-repeat center right;
}
</style>
<!--[if IE]>
<script type="text/javascript">
// <![CDATA[
if(window.navigator.systemLanguage && !window.navigator.language) {
function hoverIE() {
var LI = document.getElementById("Navigation").firstChild;
do {
if (sucheUL(LI.firstChild)) {
LI.onmouseover=einblenden; LI.onmouseout=ausblenden;
}
LI = LI.nextSibling;
}
while(LI);
}
function sucheUL(UL) {
do {
if(UL) UL = UL.nextSibling;
if(UL && UL.nodeName == "UL") return UL;
}
while(UL);
return false;
}
function einblenden() {
var UL = sucheUL(this.firstChild);
UL.style.display = "block"; UL.style.backgroundColor = "#eee";
}
function ausblenden() {
sucheUL(this.firstChild).style.display = "none";
}
window.onload=hoverIE;
}
// ]]>
</script>
<![endif]-->
</head>
<body class='navbar'>
<div class="navsection"></div>
<div class="navsectiontitle">TEST</div>
<ul class="navsectionlinks">
<div id="Tmenu">
<ul id="Navigation">
<li><a id="aktuell" href="#Beispiel">Komponente</a>
<ul>
<li><a href="">1. Seite</a></li>
<li><a href="#Beispiel">2. Seite</a></li>
<li><a href="#Beispiel">3. Seite</a></li>
<li><a href="#Beispiel">4. Seite</a></li>
<li><a href="#Beispiel">5. Seite</a></li>
<li><a href="#Beispiel">6. Seite</a></li>
<li><a id="aktuell" href="#Beispiel">2. Buch</a>
<ul>
<li><a href="">1. Seite</a></li>
<li><a href="#Beispiel">2. Seite</a></li>
<li><a href="#Beispiel">3. Seite</a></li>
<li><a href="#Beispiel">4. Seite</a></li>
<li><a href="#Beispiel">5. Seite</a></li>
<li><a href="#Beispiel">6. Seite</a></li>
</ul>
</li>
</ul>
</li>
<li><a id="aktuell" href="#Beispiel">Bearbeitung</a>
<ul>
<li><a href="#Beispiel">1. Bearbeitung</a></li>
<li><a href="#Beispiel">2. Bearbeitung</a></li>
<li><a href="#Beispiel">3. Bearbeitung</a></li>
<li><a href="#Beispiel">4. Bearbeitung</a></li>
<li><a href="#Beispiel">5. Bearbeitung</a></li>
</ul>
</li>
</ul>
<div></div>
</div>
</ul>
</html>