[Résolu] Remplacement dynamique d'images

Bonjour,

mon site doit afficher certaines images selon l'état d'un radio button :

j'ai des images nommées xxx-80.jpg et d'autres nommées xxx-90.jpg, appelées depuis différents dossier (les noms des images et les chemins des dossiers peuvent varier),
et deux radios button aux valeurs 80 ou 90,

je voudrais que dans l'état par defaut (bouton radio 80 actif) toutes les images xxx-80.jpg soient affichées,
mais que quand le bouton radio 90 est actif, les images soient toutes remplacées par leur équivalent xxx-90.jpg (en soit un remplacement dynamique du nom du fichier image)

Est-ce possible de faire cela en javascript ? je suis perdue, toute aide est la bienvenue

Salut,

Bien sur en Js. Change le src dynamiquement au click sur le bouton radio : https://www.w3schools.com/jsref/prop_img_src.asp
Modifié par _laurent (09 Mar 2018 - 15:09)

Oui sauf que dans l'exemple en lien on connait l'id de base de l'image et le src de fin,

ce que je voudrais c'est que le script trouve toutes les images avec -80 dans le src pour les remplacer par leur équivalent avec -90 dans le src

Génial merci !

Bonjour,

J'aimerai bien tenter les modifications que vous proposez sur mon site www.mon-vpn.fr mai je ne suis pas sûr d'en avoir la technique. Est-ce vraiment complexe ?

Merci d'avance

Bonjour dylis,
Si tu a plein d'autres images qui ne doivent pas être modifiées, utilise querySelectorAll() je pense que cela rendra ton traitement "plus rapide" (ne prend que les img qui nous intéressent ) :

var images = document.querySelectorAll('img[src$="-80.png"]');

et supprime le test :

 if ( imagesrc.endsWith('-80.png') ) { }

C'est plus simple en basculant (toggle) une class du conteneur d'images
https://codepen.io/bazooka07/pen/XqMgGQ