Ajax-loader-large-white
Fonctions et sélecteurs jQuery
Sélectionner par classe

Nous n'avons pas à nous limiter à des éléments HTML comme <p> et <div> ; Essentiellement, nous pouvons mettre n'importe quel sélecteur CSS entre guillemets et le passer à $(). Ça veut dire que nous pouvons aussi sélectionner des classes !

Souvenez-vous que nous pouvons sélectionner des classes en CSS en utilisant le point (.). Si nous avons class="red" dans notre HTML, nous pouvons le cibler dans le CSS avec .red. En jQuery, tout ce dont nous avons besoin est de mettre '.red' entre guillemets, et nous pouvons le passer à $() pour le convertir en objet jQuery.

Instructions

Entraînons-nous un peu avec l'action .click().

Complétez le code jQuery de telle sorte que les quatre divs de classe '.vanish' disparaîtront (fadeOut()) lentement ('slow') quand le bouton (button) sera cliqué (.click()).

?
Bloqué ? Voici une astuce ! Astuce

À la ligne 2, vous voudrez placer l'élément button dans $() pour le transformer en objet jQuery.

À la ligne 3, vous voudrez sélectionner '.vanish' (pour ce qui doit disparaître) et lui dire de .fadeOut() (disparaître en fondu) avec l'argument 'slow'. Rappelez-vous, en faisant disparaître les objets jQuery '.vanish', tous les '.vanish' sont impactés. Nous allons bientôt voir comment n'altérer qu'un seul élément !

index.html
stylesheet.css
script.js
project
View Preview