Kurze Code Erklärung

Davide

Mitglied
Hallo zusammen.

Ich habe mir ein nettes Script für ein Menü herausgesucht und habe es soweit auch angepasst, dass es zu meiner Seite passt. Eine Sachen bereitet mir allerdings noch kleine Probleme. Wenn ich ein Menüpunkt mit Untermenüs anklicke, dort eine Unterseite auswähle, erscheint auf der Folgeseite das Menü wieder geschlossen. Ich habe mir das JS Script mit meinem minimalen JS Wissen angeschaut und erstmal eine Lösung gefunden, die aber wohl mehr oder weniger eine Notlösung ist, weil das so nicht gedacht ist.

So wie ich das verstehe (Grundprinzip) ist es möglich über Cookies den aufgeklappten Zustand auf der Folgeseite zu erzwingen. Leider weiss ich nicht, wo ich ansetzen muss. Ich denke, ich muss eine Erweiterung (Information) an den Link in der Navi anhängen, so dass diese auf der neu geladenen Seite aus dem Cookie oder Adressfeld herausgelesen wird. Momentan habe ich einfach über "block" auf der entsprechenden Seite im Vorfeld den Zustand erzwungen, allerdings führt es zu einem unschönen Effekt, es muss 2 x geklickt werden, um den Menüpunkt zu schließen und die Abstände werden kleiner (den Grund bin ich noch nicht angegangen).

Anbei das JS aus der .js Datei und ein HTML Baustein, aus dem die Navi besteht (für die bessere Übersicht!)

Code:
var persistmenu="no" //"yes" or "no". Make sure each SPAN content contains an incrementing ID starting at 1 (id="sub1", id="sub2", etc)
var persisttype="sitewide" //enter "sitewide" for menu to persist across site, "local" for this page only

if (document.getElementById){ //DynamicDrive.com change
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}

function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change
if(el.style.display != "block"){ //DynamicDrive.com change
for (var i=0; i<ar.length; i++){
if (ar[i].className=="submenu") //DynamicDrive.com change
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}

function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

function onloadfunction(){
if (persistmenu=="yes"){
var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
var cookievalue=get_cookie(cookiename)
if (cookievalue!="")
document.getElementById(cookievalue).style.display="block"
}
}

function savemenustate(){
var inc=1, blockid=""
while (document.getElementById("sub"+inc)){
if (document.getElementById("sub"+inc).style.display=="block"){
blockid="sub"+inc
break
}
inc++
}
var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
var cookievalue=(persisttype=="sitewide")? blockid+";path=/" : blockid
document.cookie=cookiename+"="+cookievalue
}

if (window.addEventListener)
window.addEventListener("load", onloadfunction, false)
else if (window.attachEvent)
window.attachEvent("onload", onloadfunction)
else if (document.getElementById)
window.onload=onloadfunction

if (persistmenu=="yes" && document.getElementById)
window.onunload=savemenustate

HTML:
<div class="menutitle" onclick="SwitchMenu('sub1')">Menue</div>
<span class="submenu" id="sub1">
- <a href="untermenue.html">Untermenue1</a><br>
- <a href="untermenue.html">Untermenue1</a><br>
- <a href="untermenue.html">Untermenue1</a><br>
- <a href="untermenue.html">Untermenue1</a>
</span>

Dank im Voraus für die Tipps. Gern würde ich auch erklärt bekommen was an welcher Stelle bewirkt wird, dies aber, wenn einer Lust und Zeit hat.

Danke!
 
Zurück