Pour cet exercice, nous allons modifier l’action performée par Goku, le personnage principal de Dragonball, en fonction du bouton radio sélectionné.
Aperçu du résultat 👇
Matériel
Pen de départ
Vous n’avez qu’à écrire du HTML (nul besoin d’ajouter du JavaScript ou de modifier le CSS).
https://tim-montmorency.com/timdoc/582-215MO/html/formulaire-intermediaire/exercices/dragonball/images/top.png
https://tim-montmorency.com/timdoc/582-215MO/html/formulaire-intermediaire/exercices/dragonball/images/right.png
https://tim-montmorency.com/timdoc/582-215MO/html/formulaire-intermediaire/exercices/dragonball/images/bottom.png
https://tim-montmorency.com/timdoc/582-215MO/html/formulaire-intermediaire/exercices/dragonball/images/left.png
Requis
Ajouter une div avec une classe : wrapper.
À l'intérieur de la div, ajouter 4 "input" de type radio, l'attribut "name" est action et les classe : radio radio-top, radio radio-right, radio radio-bottom, radio radio-left.
Ensuite, ajouter les images avec les classes : image image-top, image image-right, image image-bottom, image radio-left
Une seule image de Goku doit être visible à la fois.
Notes de cours 📚