Bonjour,

Non non je ne vais pas vous parler de bal musette ni d'accordéon...
J'utilisais la librairie JQuery et le widget "accordion", mais j'avais besoin que chaque onglet puisse se déplier.
J'ai donc trouvé un script qui reproduisait ça (le code est ci-dessous)

J'ai réussi à le rendre sortable (comme le widget original) et maintenant j'aimerai le rendre dropable de manière à pouvoir déposer dans un cet accordion un autre accordion (servant en gros de conteneur).

Mon code est le suivant :
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
25
26
27
28
29
30
31
32
 
<script type="text/javascript">
	$('#notaccordion').addClass('ui-accordion ui-widget ui-helper-reset ui-accordion-icons')
		.find('h3')
		.addClass('ui-accordion-header ui-helper-reset ui-state-default ui-corner-top ui-corner-bottom')
		.prepend('<span class="ui-icon ui-icon-triangle-1-e"></span>')
		.click(function() {
			$(this).toggleClass('ui-accordion-header-active').toggleClass('ui-state-active')
			.toggleClass('ui-state-default').toggleClass('ui-corner-bottom')
			.find('> .ui-icon').toggleClass('ui-icon-triangle-1-e').toggleClass('ui-icon-triangle-1-s')
			.end().next().toggleClass('ui-accordion-content-active').toggle();
			return false;
		})
		.next().addClass('ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom').hide();
 
	$("#notaccordion h3").click(function(event) {
		if (stop) {
			event.stopImmediatePropagation();
			event.preventDefault();
			stop = false;
		}
	});
 
	$("#notaccordion").sortable({
		axis: "y",
		handle: "h3",
		stop: function(event, ui) {
			stop = true;
		}
	});
});
</script>
Avec mon code html :
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
 
<div id="notaccordion">
	<div>
		<h3><a href="#">Section 1</a></h3>
		<div>
			<p>un texte.</p>
		</div>
	</div>
	<div>
		<h3><a href="#">Section 2</a></h3>
		<div>
			<p>une autre texte</p>
		</div>
	</div>
</div>
Comment faire ?

Autre soucis, quand je cliques droit sur un onglet pour le faire glisser, lorsque je relâche le bouton l'onglet s'ouvre ou se ferme. Il y a quelque chose à modifier dans le " .click(function() { " mais je ne vois pas trop

Si vous avez des suggestions sur une autre méthode, je suis tout ouie.

Cordialement,