[Résolu] Plusieurs arguments à la suite ?

Bonjour tout le monde !

Alors voilà, je suis en train de créer un affinage de catalogue pour la boite dans laquelle je travail et notamment pour mes études (je suis actuellement en alternance). J'ai donc été chercher puis modifier à ma façon un petit script JQuerry me permettant de changer une image en une autre lorsque l'on clique dessus :

<a href="#"><img class="expanded" id="monImage" src="img/contract.jpg"/></a>

	$('#monImage').on({'click': function() {
		var src = ($(this).attr('src') === 'img/contract.jpg')
		? 'img/expand.jpg'
		: 'img/contract.jpg';
		$(this).attr('src', src);
		}
		})

Le problème est que seul l'ID de ma première image est récupérée et du coup, ce script ne fonctionne uniquement que sur une image . J'ai penser à ajouter plusieurs arguments afin de compléter les ID manquants comme ça :

$('#monImage', '#monImage1', '#monImage2').on({'click': function() 

J'ai de même essayer avec des + mais rien n'y fait. Je vous conseil d'allez voir par vous même, vous remarquerez que seul le premier [-] fonctionne sur le premier filtre : www.arnaud-benez.net/affinage/affinage.html

En espérant avoir été assez clair

Merci d'avance,

Cordialement

Hello,

Ça ne fonctionne pas car toutes les images ont le même id.

Bon après-midi !

Euh... Le problème viendrait pas plutôt de la manière d'écrire le "on" et tout ce qui va après ?

Et sinon, tu peux très bien ajouter une classe à tes images au lieu d'une id commun (ça sert à ça les classes) et ça marche très bien.

Un petit exemple :
Le code sert à rien, mais en gros : si tu cliques sur un avatar, il remet tous les avatars visibles et efface celui sur lequel tu as cliqué. Si tu cliques sur un smiley, il efface le smiley et remet tous les avatars.

http://codepen.io/anon/pen/burFa

Désole pour le double-post mais c'est afin de ne pas se mélanger les pinceaux. Alors voilà, j'ai correctement effectuer le tuto énoncé plus haut afin d'obtenir des fonts-icons à la place d'une simple image mais du coup, je me retrouve coincé dans ma script actuel.

En effet, mon script se servait d'image et je dois donc remplacer les images par ces fameuses fonts-icons. Hors ma question est : comment ?

Merci encore =)

Rappel de mon code JS actuel :

	<!-- Scripts JQuerry -->
<script type="text/javascript">
        $('.expanded').click(function() {
	var src = ($(this).attr('src') === 'img/contract.jpg')? 'img/expand.jpg': 'img/contract.jpg';
	$(this).attr('src', src);
        });
</script>

PS : Je vais essayer de faire en sorte que le script change maintenant les class comme cités plus haut. Je suis un peu une quiche mais je vais essayer de trouver comment m'y prendre
Modifié par Mister-Hims (26 Aug 2014 - 15:14)

Bonjour et merci de ta participation

J'ai réussi à me concocter un petit code avec l'attribut ToggleClass que tu m'a envoyé et y'a pas à dire, ça fonctionne du tonnerre !

Mon problème est presque résolu, manque un seul petit détail :
Le fait d'avoir ajouter la font-icon, le curseur http://upload.wikimedia.org/wikipedia/commons/0/06/Cursor_Hand.png n'apparait plus, le curseur texte l'a remplacé. Connaissez vous un moyen d'y remédier ?

Merci

Rappel du lien en question : http://www.arnaud-benez.net/affinage/affinage_updated.html
Modifié par Mister-Hims (26 Aug 2014 - 16:10)

cursor : pointer

dans le css

Ah ba niquel dans ce cas, j'avais déjà vu ça quelque part mais je ne m'étais pas demandé son utilité.

Merci beaucoup à vous tous