Bonjour,

Sur le Jquery mobile,
je souhaite réduire ou développer tous les DIV "collapsible" en cliquant sur un bouton.
Merci.

mon script dans <head></head> :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script type="text/javascript"><!-- DEBUT script pour les listes cachées-->
$(document).ready(function() {
		//réduit TOUS les niveaux
		$(".reduit_tous_messages").click(function(){
		$("#accordeon h3").removeClass("expand").addClass("collapse");
		$("#accordeon h3 div").removeClass("expand").addClass("collapse");
		return false;	});
		//montre TOUS les niveaux
		$(".montre_tous_messages").click(function(){
		$("#accordeon h3").removeClass("expand").addClass("collapse");
		$("#accordeon h3 div").removeClass("expand").addClass("collapse");
		return false;		});
    });
</script><!-- FIN script pour les listes cachées-->
....
mon html ensuite :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<div data-role="collapsible-set" data-theme="c" data-content-theme="d"> <!-- DEBUT ACCORDDEON -->
 
<div data-role="collapsible" data-collapsed="true" data-theme="c" data-content-theme="c" id="accordeon"><!-- DEBUT DATE -->
<h3>Mardi 22 Novembre</h3>
 
<div data-role="collapsible" data-collapsed="true"  data-theme="e" data-content-theme="e" id="accordeon">>
<h3>Type 1</h3>
<div data-role="collapsible" data-collapsed="true" data-theme="c" data-content-theme="d" id="accordeon">>
<h4>Artiste 1</h4>
<p>Description du premier....</p>
</div>
</div>
 
<div data-role="collapsible" data-collapsed="true"  data-theme="e" data-content-theme="e" id="accordeon">>
<h3>Type 2</h3>
<div data-role="collapsible" data-collapsed="true" data-theme="c" data-content-theme="d" id="accordeon">>
<h4>Artiste 2</h4>
<p>Description du Deuxième....</p>
</div>
</div>
 
</div> <!-- FIN DATE -->
 
</div> <!-- FIN ACCORDDEON -->