He intentado mil maneras y no lo consigo.
Tengo una lista con elementos con clase i id (todas las clases son iguales i el id es único para cada elemento). Mi intención es que desaparezca la lista y aparezcan otras cosas pero con cosas de css cambiadas según el elemento de la lista al que hagamos click.
Mejor pongo el código y entendereis algo más.
el html:
Código:
<ul>
<li class="campionat" id="c1"><div class="logo_camp"><img src="logos/soccer/futsal.jpg" /></div><div class="descripcio_camp">El torneig de futbol sala per a equips federats nacionals i internacionals</div>
</li>
<li class="campionat" id="c2"><div class="logo_camp"><img src="logos/soccer/fut7.jpg" /></div><div class="descripcio_camp">El torneig de futbol sala per a equips federats nacionals i internacionals</div>
</li>
<li class="campionat" id="c3"><div class="logo_camp"><img src="logos/soccer/fut11.jpg" /></div><div class="descripcio_camp">El torneig de futbol sala per a equips federats nacionals i internacionals</div>
</li>
<li class="campionat" id="c4"><div class="logo_camp"><img src="logos/soccer/futsal24.jpg" /></div><div class="descripcio_camp">El torneig de futbol sala per a equips federats nacionals i internacionals</div></li>
</ul>
el js que va en el ready
Código:
$("li.campionat").click(function(event) {
$("li.campionat").fadeOut();
$("#events_aux").fadeOut();
$("#thumbs_c").fadeIn();
$("#thumb_c1").fadeIn();
$("#thumb_c2").fadeIn();
$("#thumb_c3").fadeIn();
$("#thumb_c4").fadeIn();
$("#barra_camp").fadeIn();
AQUÍ FALTA COMO CONTROLARLO I EN UN IF METER EL CAMBIO QUE TOQUE PARA CADA ID
});
Bueno, lo he puesto dentro, pero básicamente es eso.
He intentado con event.target y nada, con otras formas, algunas surrealistas de comparar el id, pero nada. Y por la red no encuentro como solucionarlo.