Discussion :

[tmlpqsdpmdlc]

Bonjour,

Lorsque $(".cacher").on("click") est sollicité, tout va bien.

Mon problème est lorsque je cherche à solliciter $(".afficher").on("click") car malgré que la classe soit bien changée (test avec alert) ce sera toujours $(".cacher").on("click") qui sera sollicité


Je passe par une balise hidden pour éviter les problèmes d'interprétation serveur en twig sous Symfony 2

Le html:

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<div class="cacher" id="controleBanniere">
	<img src="{{ asset('/mon-site/images/chevronFermeture.png') }}" alt="réduire la bannière vidéo">
</div>
 
<div id="hidden">
        <div id="imageOuverture">
		<img src="{{ asset('/mon-site/images/chevronOuverture.png')}}" alt="Afficher la bannière vidéo">
	</div>
	<div id="imageFermeture">
		<img src="{{ asset('/mon-site/images/chevronFermeture.png')}}" alt="Cacher la bannière vidéo">
	</div>
</div>

Le JQuery:

Code jquery :

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
 
$(".afficher").on("click", function()
{
	$("#banniereVideo").css("display", "block");
	$(this).removeClass("afficher");
	$(this).addClass("cacher");
	$(this).html("");
	$(this).html($("#imageFermeture").html());
});
 
$(".cacher").on("click", function()
{
	$("#banniereVideo").css("display", "none");
	$(this).removeClass("cacher");
	$(this).addClass("afficher");
	$(this).html("");
	$(this).html($("#imageOuverture").html());
});

Merci de votre aide

[Tsilefy]

Tu as choisi la version incorrecte de .on()

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
$("body").on("click", ".afficher", function()
{
	$("#banniereVideo").css("display", "block");
	$(this).removeClass("afficher");
	$(this).addClass("cacher");
	$(this).html("");
	$(this).html($("#imageFermeture").html());
});
 
$("body").on( "click", ".cacher", function()
{
	$("#banniereVideo").css("display", "none");
	$(this).removeClass("cacher");
	$(this).addClass("afficher");
	$(this).html("");
	$(this).html($("#imageOuverture").html());
});