zurück zur Startseite
  


Zurück XHTMLforum > Webentwicklung (außer XHTML und CSS) > Javascript & Ajax
Seite neu laden Aufklappendes menü

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 13.07.2006, 12:04
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.07.2006
Beiträge: 8
relativ-egal befindet sich auf einem aufstrebenden Ast
Standard Aufklappendes menü

Hallo, alle zusammen,
ich habe jetzt schon einige Stunden damit verbracht und viel im netz gesucht, aber keine befriedigende Antwort für mein problem gefunden. Wäre toll, wenn mir jemand helfen könnte.

mfg

relativ-egal
Code:
<script type="text/javascript">
function switchlayer(Layer_Name)
{
  var GECKO = document.getElementById? 1:0 ;
  var NS = document.layers? 1:0 ;
  var IE = document.all? 1:0 ;

  if (GECKO)
       {document.getElementById(Layer_Name).style.display=
	   (document.getElementById(Layer_Name).style.display=='block') ? 'none' : 'block';}
  else if (NS)
       {document.layers[Layer_Name].display=(document.layers[Layer_Name].display==
	   'block') ? 'none' : 'block';}
  else if (IE)
       {document.all[Layer_Name].style.display=(document.all[Layer_Name].style.display==
	   'block') ? 'none' : 'block';}
}
</script>

<b> So siehts aus </b> <br>


 <a href="" onclick="javascript:switchlayer('Main'); return false;">Main</a><br>
  <ul id="Main" style="display:none">
	  

  <a href="" onclick="javascript:switchlayer('Chaos'); return false;">Sub1</a><br>
   <ul id="Chaos" style="display:none">
    SubSub1.1 <br>
    SubSub1.2 <br>
    SubSub1.3 <br>
   </ul>
 	
  <a href="" onclick="javascript:switchlayer('IG'); return false;">Sub2</a><br>
   <ul id="IG" style="display:none">
    SubSub2.1<br>
    SubSub2.2<br>
   </ul>

  <a href="" onclick="javascript:switchlayer('SM');return false;">Sub3</a><br>
   <ul id="SM" style="display:none">
    SubSub3.1<br>
    SubSub3.2<br>
   </ul>
  </ul>
<br><br><br><br><br><br>

<b> So solls eigendlich aufgeklappt aussehen </b> <br>

Main<br>
&nbsp;Sub1<br>
&nbsp;&nbsp;SubSub1.1<br>
&nbsp;&nbsp;SubSub1.2<br>
&nbsp;&nbsp;SubSub1.3<br>
<br>
&nbsp;Sub2<br>
&nbsp;&nbsp;SubSub2.1<br>
&nbsp;&nbsp;SubSub2.2<br>
&nbsp;&nbsp;SubSub2.3<br>
<br>
&nbsp;Sub3<br>
&nbsp;&nbsp;SubSub3.1<br>
&nbsp;&nbsp;SubSub3.2<br>
&nbsp;&nbsp;SubSub3.3<br>
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 13.07.2006, 16:41
bel bel ist offline
Faulancer
neuer user
 
Registriert seit: 31.01.2005
Beiträge: 60
bel befindet sich auf einem aufstrebenden Ast
Standard

Hallo,

vielleicht möchtest du dir erst nochmal ansehen, wie man Listen aufbaut: http://de.selfhtml.org/html/text/listen.htm#aufzaehlung

Und dann versuch bitte dein Problem etwas deutlicher zu beschreiben.. mir ist jedenfalls nicht ganz klar was genau nicht funktioniert. Die Einrückung? das Ausklappen? In welchem Browser...?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 13.07.2006, 17:09
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.07.2006
Beiträge: 8
relativ-egal befindet sich auf einem aufstrebenden Ast
Standard

moin,
ich will ne Liste haben, die aussieht, wie diese hier.
http://de.selfhtml.org/html/text/anzeige/ul_ul.htm
Allerdings möchte ich, dass die unterpunkte nur ein zeichen weit eingerückt werden und nicht so wie jetzt einen ganzen tab ...

thx schon mal für die antwort
mfg
Mit Zitat antworten
  #4 (permalink)  
Alt 13.07.2006, 17:23
bel bel ist offline
Faulancer
neuer user
 
Registriert seit: 31.01.2005
Beiträge: 60
bel befindet sich auf einem aufstrebenden Ast
Standard

Alles klar
Dann solltest du als erstes deine Listen vervollständigen (dir fehlen die li-tags) und korrekt verschachteln.
Die Darstellung der Listen, also auch die Einrückung kannst du dann mit CSS definieren, siehe zum Beispiel hier.

Mit den Eigenschaften padding und margin kannst du die Abstände bestimmen. Ansonsten ist der Thread wohl im CSS-Forum besser aufgehoben als bei JavaScript.. (mod?)
Mit Zitat antworten
  #5 (permalink)  
Alt 13.07.2006, 18:03
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.07.2006
Beiträge: 8
relativ-egal befindet sich auf einem aufstrebenden Ast
Standard

hi, das li habe ich extra weggemacht, und möchte diese punkte davor auch nicht unbedingt haben
eigendlich möchte ich nur ein schön kompaktes aufklappendes menü in baumstruktur ... und auf selfhtml.org findeich so was einfach nicht, das erwähnte kommt dem am nächsten, ich krich halt nur die tabs nich weg ...

mfg
Mit Zitat antworten
  #6 (permalink)  
Alt 13.07.2006, 18:42
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von relativ-egal
hi, das li habe ich extra weggemacht,
Das ist nicht zulässig. Validier dein Dokument.

Zitat:
und möchte diese punkte davor auch nicht unbedingt haben
Dann blende sie aus. Den Link zu den nötigen Eigenschaften hat dir bel bereits gepostet.

Zitat:
ich krich halt nur die tabs nich weg ...
Diese "tabs" werden durch die Eigenschaften margin und padding festgelegt. Siehe oben.

Bitte beschäftige dich mit den Grundlagen von CSS.

Tutorial zu verschachtelten Listen:
http://css.maxdesign.com.au/listutor...troduction.htm
Mit Zitat antworten
  #7 (permalink)  
Alt 13.07.2006, 18:52
Benutzerbild von The Doc
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 19.01.2005
Beiträge: 1.113
The Doc befindet sich auf einem aufstrebenden Ast
Standard

Und was hält dich davon ab, mal das zu machen, was man dir rät?

Dein HTML ist falsch! - mach es richtig. Sprich - füg die <li> wieder hinzu und entferne die <br>.

Dann guck dir CSS an - kann doch wirklich nicht wahr sein... Mit margin und padding kriegst du die "tabs" weg, mit li { list-style:none} entfernst du die Bullets.
__________________
Bitte keine PN's - schreibt mir ne anständige Mail oder sprecht mich über Msn / Icq an
Milian Wolff | Markdownify | Typogridder
Mit Zitat antworten
  #8 (permalink)  
Alt 14.07.2006, 09:56
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.07.2006
Beiträge: 8
relativ-egal befindet sich auf einem aufstrebenden Ast
Standard

moin
ich habe gestern abend noch n paar sachen ausprobiert.
Danke schon mal für die Antworten, ich hoffe ich hab eure geduld nicht überreizt ...
naja ich hab jetzt hier 2 elemente, die jedes für sich genommen funktioniert ... einmal das java script und einmal css.
Das sieht volgender maßen aus.
Code:
<html>
<body>

<script type="text/javascript">
function switchlayer(Layer_Name)
{
  var GECKO = document.getElementById? 1:0 ;
  var NS = document.layers? 1:0 ;
  var IE = document.all? 1:0 ;

  if (GECKO)
       {document.getElementById(Layer_Name).style.display=
	   (document.getElementById(Layer_Name).style.display=='block') ? 'none' : 'block';}
  else if (NS)
       {document.layers[Layer_Name].display=(document.layers[Layer_Name].display==
	   'block') ? 'none' : 'block';}
  else if (IE)
       {document.all[Layer_Name].style.display=(document.all[Layer_Name].style.display==
	   'block') ? 'none' : 'block';}
}
</script>

<style type="text/css">
#navcontainer ul
 {
  margin: 0; 
  padding: 0;
  list-style-type: none;
 }
</style>
 <li><a href="" onclick="javascript:switchlayer('main'); return false;">main</a>
  <ul id="main" style="display:none">
	  

  <li><a href="" onclick="javascript:switchlayer('Sub1'); return false;">Sub1</a>
   <ul id="Sub1" style="display:none">
    <li>Sub1.1 </li>
    <li>Sub1.2 </li>
    <li>Sub1.3 </li>
   </ul></li>
 	
  <li><a href="" onclick="javascript:switchlayer('Sub2); return false;">Sub2</a>
   <ul id="Sub1" style="display:none">
    <li>Sub2.1 </li>
    <li>Sub2.2 </li>
   </ul></li>

  <li><a href="" onclick="javascript:switchlayer('Sub3');return false;">Sub3</a>
   <ul id="Sub1" style="display:none">
    <li>Sub3.1</li>
    <li>Sub3.2</li>
   </ul></li>
  </ul></li>

 </body>

</html>
Jetzt ist es aber so, dass das CSS sobald das Javascript in der html datei ist nicht mehr funktioniert. Ich denke es steht dann irgendwie an der falschen stelle, ... aber ich weiß nicht wo es sonst hingehört. naja vielleicht hab ich mich auch einfach nur vertippt ... wer weiß das schon,

mit der Hoffnung auf ein wenig geduld eurer seits, einem blutigen anfänger gegenüber,

mfg
relativ-egal
Mit Zitat antworten
  #9 (permalink)  
Alt 14.07.2006, 10:44
bel bel ist offline
Faulancer
neuer user
 
Registriert seit: 31.01.2005
Beiträge: 60
bel befindet sich auf einem aufstrebenden Ast
Standard

Ganz ehrlich, bevor du mit JavaScript-Spielereien anfängst solltest du doch zumindest die Grundlagen von HTML und CSS beherrschen.
Konkret: Du hast keinen Head-Bereich in deiner Seite.
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 14.07.2006, 13:21
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.07.2006
Beiträge: 8
relativ-egal befindet sich auf einem aufstrebenden Ast
Standard

hi
ich find die ganze geschichte auch unheimlich interessant und lohnend zu lernen, ich hab nur momentan einfach nich die zeit dazu und brauch nur stumpf dieses menü
Ich hatte schon mal n header drin, hat aber nix gebracht, weshalb ich den wieder rausgenommen habe.
im prinziep habe ich den css code in den header gepackt ...
so halt ...

<head>
<style type="text/css">
#navcontainer ul
{
margin: 0;
padding: 0;
list-style-type: none;
}
</style>

</head>

sonst muss ich mir vielleicht doch mal so n html editor besorgen, weil momentan mach ich das mit dem normalen editor und da hab ich natürlich syntaktisch keine ahnung


mfg
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Menü auf Startseite funktioniert nach FORM SUBMIT nicht mehr Ceres82 (X)HTML 3 23.08.2013 22:00
Überlappende Menüs und fehlendes seitlich aufklappendes Menü SteveB CSS 3 27.04.2011 11:19
Darstellungsproblem flohpapa CSS 3 16.12.2009 09:55
Aufklappendes Menü auf Klick, das dann auch bleibt alex87 CSS 4 19.09.2009 13:49
Umbruch in einem LI bei horizontalem Menü M4rco CSS 12 13.10.2006 12:26


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:06 Uhr.