Discussion :

[mdr_cedrick]

Bonjour à tous

j'ai une demande un peut particulière dont je ne trouve pas de solution

j'utilise Accordion de Mootools et le problème c'est que les "en-tête" sur lesquelles je clique doivent avoir un background-image différent
Accordion ne fait pas ce principe puisque chaque en-tête à la même "classe" css.

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
<div id="accordion">
	<h3 id="l1" class="toggler"></h3>
	<div class="element">
		<center><img src="img/home.gif" alt="test" /></center>
	</div>
 
	<h3 id="l2" class="toggler"></h3>
	<div class="element">
		<center><img src="img/home.gif" alt="test" /></center>
	</div>
 
	<h3 id="l3" class="toggler"></h3>
	<div class="element">
		<center><img src="img/home.gif" alt="test" /></center>
	</div>
 
	<h3 id="l4" class="toggler"></h3>
	<div class="element">
		<center><img src="img/home.gif" alt="test" /></center>
	</div>
</div>

alors j'aimerais savoir si à partir de ce code javascript il est possible dans la partie onActiv de savoir si j'ai cliqué sur l'id "l1" ou "l2" ... ce qui me permettrait d'afficher ce que je veux en passant par document.getElementById('...').style ...

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
window.addEvent('domready', function()
{
	//create our Accordion instance
	var myAccordion = new Accordion($('accordion'), 'h3.toggler', 'div.element', {
		opacity: false,
		onActive: function(toggler, element)
		{
			toggler.setStyle('background-image', 'url(./img/notre_agence.gif)');
			toggler.setStyle('background-repeat', 'no-repeat');
			toggler.setStyle('height', '27px');
		},
		onBackground: function(toggler, element)
		{
			toggler.setStyle('background-image', 'url(./img/notre_agence2.gif)');
			toggler.setStyle('background-repeat', 'no-repeat');
			toggler.setStyle('height', '36px');
		}
	});
});

merci de votre aide

[mdr_cedrick]

je m'auto réponds
j'ai trouvé une solution alternative avec laquelle j'ai rajouté un onclick sur ma balise <h3> pour récupérer son id et ensuite j'agis comme ceci

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
document.getElementById(id).style.backgroundImage	= 'url(./img/comm_globale.png)';
document.getElementById(id).style.height ='51px';

merci quand même