foldout menue vertikal - javarea.de Forum powered by javarea.de

Archivlink: javarea.de Forum > JavaScript > foldout menue vertikal

Vollständigen Link anzeigen: javarea.de Forum > JavaScript > foldout menue vertikal

Pages: [1]

geschrieben von oyster am 14.03.2005 - 23:32

Hallo zusammen,

ich habe das foldoutmenue vertikal in meine seite (frameset) eingebunden und entsprechend angepasst. Hat alles wunderbar geklappt.

Nun habe ich das Problem, dass beim Anklicken eines Links im Untermenue, dieser sich zwar einwandfrei im Haupframe öffnet, das Menue hingegen im gleichen Moment wieder zuklappt.

Gibt es Möglichkeiten, das script so anzupassen/abzuändern, dass das Menue beim Anklicken der Links aufgeklappt bleibt?

Für Vorschläge bedanke ich mich vorab.

Viele Grüße

oyster

geschrieben von Patrick am 15.03.2005 - 13:08

Die möglichkeit gibt es bestimmt.... Allerdings wäre dazu der Quelltext sehr hilfreich

geschrieben von oyster am 15.03.2005 - 15:15

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta http-equiv="content-type" content="text/html; CHARSET=iso-8859-1"><title>Javascript & CSS Seitenmenu</title>

<link rel="stylesheet" title="Screen" href="jssidemenu4_files/jssidemenu4.css" type="text/css" media="screen">
<style type="text/css">

</style>

<script type="text/javascript">

</script>

<body onload="hideSub();">
<h1>Javascript und css Seitenmenu</h1>
<ul id="menu">
<li onclick="mShow(this);">Options 1
<ul>
<li style="display: none;"><a href="#">Item 1</a></li>
<li style="display: none;"><a href="#">Item 1</a></li>
<li style="display: none;"><a href="#">Item 1</a></li>
<li style="display: none;"><a href="#">Item 1</a></li>
</ul>
</li>
<li class="show" onclick="mShow(this);">Options 2
<ul>
<li style="display: none;"><a href="#">Item 2</a></li>
<li style="display: none;"><a href="#">Item 2</a></li>
<li style="display: none;"><a href="#">Item 2</a></li>
<li style="display: none;"><a href="#">Item 2</a></li>
</ul>
</li>
<li onclick="mShow(this);">Options 3
<ul>
<li style="display: none;"><a href="#">Item 3</a></li>
<li style="display: none;"><a href="#">Item 3</a></li>
<li style="display: none;"><a href="#">Item 3</a></li>
</ul>
</li>
<li onclick="mShow(this);">Options 4
<ul>
<li style="display: none;"><a href="#">Item 4</a></li>
<li style="display: none;"><a href="#">Item 4</a></li>
<li style="display: none;"><a href="#">Item 4</a></li>
<li style="display: none;"><a href="#">Item 4</a></li>
<li style="display: none;"><a href="#">Item 4</a></li>
</ul>
</li>
<li onclick="mShow(this);">Options 5
<ul>
<li style="display: none;"><a href="http://google.com/">Item 5</a></li>
<li style="display: none;"><a href="#&4">Item 5</a></li>
<li style="display: none;"><a href="#&4">Item 5</a></li>
<li style="display: none;"><a href="#&4">Item 5</a></li>
</ul>
</li>
</ul>

</body>
</html>

geschrieben von Patrick am 15.03.2005 - 16:54

Soll das Menü nur zuklappen, wenn du auf die Hauptauswahl, in deinem Fall "option...." klickst oder wie soll ich dein Problem jetzt verstehen???

Im Moment ist es ganz klar, dass das Menü zu klappt sobald ud auf einen unterpunkt klickst.

geschrieben von oyster am 15.03.2005 - 17:17

Hallo Patrick,

entschuldige, ich hatte noch einen Beitrag hinter den Quellcode angefügt, aber den irgendwie aus Schusseligkeit vergessen zu speichern.

Genau, das Menue soll nur dann zuklappen, wenn ich auf die Hauptauswahl - hier "option" klicke und sollte aufgeklappt bleiben, wenn ich auf einen Punkt im Untermenue klicke.

Ich hoffe, das war einigermaßen verständlich.

Liebe Grüße

oyster

geschrieben von Patrick am 15.03.2005 - 18:29

Joar,

also das Problem liegt darin, dass du mit

<li onclick="mShow(this);">Options 1
<ul>
<li style="display: none;"><a href="#">Item 1</a></li>
<li style="display: none;"><a href="#">Item 1</a></li>
<li style="display: none;"><a href="#">Item 1</a></li>
<li style="display: none;"><a href="#">Item 1</a></li>
</ul>
</li>

Immer einen kompletten Block einpackst.... Und dadurch dieser Dann auch komplett in diesem Fall auf, bzw. zu gemacht wird.

Du musst sozusagen den Haupt-, von den Unterpunkten trennen.

In der Theorie sieht das so aus:

<li name=Haupt1 onlick="..." >Options<li>
<ul name=Sub1>
<li....item1...
<li....item2...
<li...item3...
</ul>

So, bei OnClick öffnest du Haupt1 und Sub1, bzw. schließt diese beiden...

Wenn du auf item1,2 oder 3 klickst, dann öffnest du nur die seite aber schließt diesen block nicht.

Versuche einfach, deinen Quellcode anzupassen. Mit ein wenig probieren, SelfHTML und logik solltest du das eigentlich hinbekommen.

Bei weiteren Fragen, einfach melden. Bitte dann direkt konkrete Fragen zu programmierproblemen.

mfG,.
Patrick

geschrieben von nujavadi am 08.07.2005 - 17:17

vielleicht kann mir jemand helfen. bei diesem menü wenn man auf z.b. 1 klickt, dann klappt das ja auf, wie macht man denn das, dass es aber wieder zu geht, wenn man auf menü2 oder so klickt und net wies momentan is offen bleibt?

geschrieben von okley am 09.07.2005 - 15:22

übernimm folgenden scriptcode:

HTML-Quelltext

1: 
2: 
3: 
4: 
5: 
6: 
7: 
8: 
9: 
10: 
11: 
12: 
13: 
14: 
15: 
16: 
17: 
18: 
19: 
20: 
21: 
22: 
23: 
24: 
25: 
26: 
27: 
28: 
29:

function hideSub( ) 
{
  if (!document.getElementsByTagName)
     return;
  var mnu = document.getElementById("menu");
  var toplis = mnu.getElementsByTagName("li");
  for (it = 0; it < toplis.length; it++) { /* each top li */
    var sublis = toplis[it].getElementsByTagName("li");
    for (is = 0; is < sublis.length; is++) { /* each sub li */
       sublis[is].style.display = 'none';
    }
  }
}
function mShow(Me)
{
	if (!Me.getElementsByTagName)
	return;
	// alle menus einklappen
	hideSub();
	var mylis = Me.getElementsByTagName("li");
	if (!mylis)
	return;
	for (j = 0; j < mylis.length; j++) {
	  if (mylis[j].style.display == 'block')
	    mylis[j].style.display = 'none';
	  else
	    mylis[j].style.display = 'block';
	}
}

dann wird es gehen ;)
die methode hideSub() besteht ja schon, sie wurde bis jetz aber nur beim laden der seite aufgerufen (<body onload='...'>). ich hab sie jetzt einfach noch bei jedem klick auf ein menupunkt aufgerufen, bevor das aktuelle submenu ausgefahren wird ;)

geschrieben von nujavadi am 11.07.2005 - 19:13

danke funktioniert bestens

geschrieben von p!lle am 24.06.2007 - 19:49

Zitat

Original geschrieben von Patrick am 15.03.2005 - 18:29

Joar,

also das Problem liegt darin, dass du mit

<li onclick="mShow(this);">Options 1
<ul>
<li style="display: none;"><a href="#">Item 1</a></li>
<li style="display: none;"><a href="#">Item 1</a></li>
<li style="display: none;"><a href="#">Item 1</a></li>
<li style="display: none;"><a href="#">Item 1</a></li>
</ul>
</li>

Immer einen kompletten Block einpackst.... Und dadurch dieser Dann auch komplett in diesem Fall auf, bzw. zu gemacht wird.

Du musst sozusagen den Haupt-, von den Unterpunkten trennen.

In der Theorie sieht das so aus:

<li name=Haupt1 onlick="..." >Options<li>
<ul name=Sub1>
<li....item1...
<li....item2...
<li...item3...
</ul>

So, bei OnClick öffnest du Haupt1 und Sub1, bzw. schließt diese beiden...

Wenn du auf item1,2 oder 3 klickst, dann öffnest du nur die seite aber schließt diesen block nicht.

Versuche einfach, deinen Quellcode anzupassen. Mit ein wenig probieren, SelfHTML und logik solltest du das eigentlich hinbekommen.

Bei weiteren Fragen, einfach melden. Bitte dann direkt konkrete Fragen zu programmierproblemen.

mfG,.
Patrick

Hallo,
sorry das ich den alten Thread nochmal rauskram, aber irgendwie haut das bei mir net hin.
Warum sollte sich in deinem Bsp. auch das Sub-Menu öffnen? Wird doch nirgends gesagt das es sich öffnen soll...
könntest du das nochmal erläutern?

geschrieben von Patrick am 25.06.2007 - 21:20

N'Abend,

Was möchtest du denn genau machen?

Ich habe in meinem Post damals lediglich das Prinzip erläutert, wie man vorgehen kann. Es ist kein kompletter Quellcode.

geschrieben von p!lle am 25.06.2007 - 21:31

Hallo,
erstmal Danke das du darauf überhaupt noch antwortest...

also, ich möchte auch dass das Menü bei einem Klick auf einen Link nicht automatisch zuklappt...

geschrieben von Patrick am 28.06.2007 - 21:50

Hallo,

halte dich einfach an den vorgeschlagenen Code von Okley, der scheint wie hier gepostet wurde bestens zu funktionieren...

Du nimmst also den original Quellcode und tauscht die beiden entsprechenden Funktionen mit denen von Okley aus und schons ollte es funktionieren wie du benötigst.

Einfach mal versuchen.... Ansonsten frag nochmal.. --> Dann allerdings bitte mit Link, wo man sich das ganze live ansehen kann

Gruß,
Patrick

geschrieben von p!lle am 29.06.2007 - 06:53

Zitat

Hallo,
ich meine eigentlich mehr das hier zitierte^^ zuklappen muss es bei einem Klick auf ein anderes Menü nicht unbedingt.
Ich möchte eigentlich nur das es bei einen Klick auf einen Punkt des Submenü's nicht zuklappt...
(allerdings wird die Seite bei einem Klick auf einen Link im Sebmenü neugeladen, da ich es mit PHP realisiere...)
danke schonmal...
j.