div semplici Espandi/Collapse> JQuery?

Question

Ho bisogno di aggiungere alcuni handle di espansione/compressione dello stile armoniano a una serie di div del contenitore padre nella mia applicazione. È qualcosa di troppo semplice per una libreria come jquery?

Esempio:

<div class="handleDiv"> expand | collapse 
    <div>child element</div> 
    <div>child element</div> 
</div> 

<div class="handleDiv"> expand | collapse 
    <div>child element</div> 
    <div>child element</div> 
</div> 

Answer 1

provare qualcosa di simile:

$('.handleDiv').click(function() { 
    $(this).children().toggle(); 
}); 

Che verrà espandere o nascondere il contenuto dei s "handleDiv" ogni volta che si fa clic. Suggerirei di far sì che quei collegamenti "espandi | collapse" e attaccassero il gestore dei clic a loro, in modo che un clic in qualsiasi punto del div non lo attivi.

Se si vuole che iniziano chiuso, sia lo stile li chiuse nel foglio di stile:

.handleDiv div { 
    display: none; 
} 

o aggiungere un ".nascosto()" alla fine del frammento di jQuery, all'inizio della mia risposta .

Answer 2

Ho appena scritto un plugin per farlo.

Vedi http://sylvain-hamel.github.io/simple-expand/