Listen ausklappen wie Windows-Explorer-Ordneransicht

[martinibook]

Hallo,

Ich habe auf einer Webseite einige Listen untereinander, die jeweils um 30 Einträge haben. Ich möchte das gerne so machen, dass zuerst nur die Oberpunkte sichtbar sind und auf einen Klick sich die Liste ausklappt und man alle Unterpunkte sichtbar sind.

Wie mache ich das möglichst einfach?

Martin

 

[ThaHammer]

onmousedown() als Funktion die das ein- und Ausklappen steuert. Dann natürlich erst einmal alles per css auf visible: hidden; stellen. Bei klick musst Du per Javaskript von hidden auf show stellen, dabei den rest immer ausblenden

 

[martinibook]

Okay, hat geklappt.

 

[cronix]

wieso onMousedown?

und ich würde nicht visible nehmen sondern display:none (weg) display:block (da)

 

[ThaHammer]

wieso onMousedown?

und ich würde nicht visible nehmen sondern display:none (weg) display:block (da)

Wer lesen kann ist klar im Vorteil. Schau halt was er will.
Warum würdest Du display nehmen?

 

[cronix]

jah er will jah net das er auf "mausw nach unten" sein menü ausklappen sindern durch einen "klick".

Display:none hat sich bei mir einfach bewährt. Ich finde das das die sauberere vraiante ist denn das element ist dann wirklich nicht da und bei visible ist es nur unsichtbar.

 

[Holly73]

Also ich würde aber anstatt onmousedown onmouseup nehmen. Das ist dann eher so wie bei allem anderen anklickbaren Zeugs.

 

[cronix]

Also ich würde aber anstatt onmousedown onmouseup nehmen. Das ist dann eher so wie bei allem anderen anklickbaren Zeugs.

er schreibt doch klick... wieso dann überhaupt "onmouseirgendwas"

 

[ThaHammer]

er schreibt doch klick... wieso dann überhaupt "onmouseirgendwas"

Wie willst Du sonst den Klick abfangen?

Ja das mit dem Display leuchtet mir ein. Bei mir war es bisher so, das das ausgeblendete geschwebt ist über dem Rest, da ist es dann egal. Wenn der Inhalt nicht schwebt ist display natürlich die Lösung!

 

[martinibook]

Ich habe jetzt folgendes:

<div class="text" id=liste1 style="display: block">

und

<a href="javascript:DivStatus('1');">

und

Pdiv.style.display = Pdiv.style.display == 'block'?'none':'block';

 

[cronix]

aus dem murks werde ich nicht schlau ...

ich würde onClick verwenden

onClick="switch(die id des divs)"

javascript:

function switch(id){
    status = document.getElementById(id).style.display; 
    if(status == block){
         document.getElementById(id).style.display = 'none';
    }else{
         document.getElementById(id).style.display = 'block';
    }  
}

 

[martinibook]

Ich habe eine DIV, die wird über einen außenstehenden A angesteuert.

 

[cronix]

hab mein beitrag oben geändert

 

[cronix]

war das nicht hilfreich ?

 

[kAbal]

Hat das jetzt geklappt?

Nunja, ich hatte genau das gleiche Problem...

Hier die Lösung:
http://movie.seb-o.net/Infos/cast_crew/cast_crew.html

Javascript von irgendwo hergeholt, sollte eigentlich selbsterklärend sein.
JS is im Header und das "aufklappen" steht dann im <a href="#" ...>

 

[ThaHammer]

ich habe so etwas ähnliches auf einer Apple Seite gefunden und heute bei einem Freund eingebaut.

Siehe: http://www.ntrsolidus.de gleich auf der Startseite

 

[martinibook]

Jaja, ich habe eine funktionierende Lösung.