jQuery Facile Application #2/5 : Animer une fenêtre modale
ERROR
00:00
00:00

TUTO jQuery Facile Application #2/5 : Animer une fenêtre modale

Carl Brison
13,00€

Téléchargement & visionnage illimité

Satisfait ou remboursé

Paiement 100% sécurisé

Dans le cadre de ma formation "jQuery Facile", je vous propose de mettre en pratique les méthodes jQuery que nous avons apprises en réalisant une seconde application concrète : l'animation d'une fenêtre modale.

Description de l'exercice que vous allez créer dans cet atelier pratique jQuery

L'exercice consistera à créer une page web contenant diverses informations, ainsi qu'un bouton.
Lorsque l'utilisateur cliquera sur ce bouton, une fenêtre modale apparaîtra depuis le haut de la page. 
Nous ajouterons une animation pour faire apparaître et disparaître la fenêtre modale. 
De plus, pour mettre en évidence la fenêtre modale, nous appliquerons une opacité réduite sur le fond d'écran.

Je mets les codes de cet exercice à votre disposition.
Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions sur ce cours.
Un QCM vous sera proposé en fin de formation et vous permettra de valider les connaissances théoriques acquises pendant la formation.

Pour apprendre rapidement et facilement le jQuery :

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Leçon 1
Mettre en place le HTML
Leçon 2
Mettre en place le CSS de l'élément #louer
Leçon 3
Mettre en place le CSS de l'élément #modale
Leçon 4
Mettre en place le jQuery pour faire apparaître et disparaître la modale
Leçon 5
Donner un effet à la modale
Leçon 6
Baisser l'opacité du fond de l'écran
Leçon 7
Conclusion

Plan détaillé du cours

Leçon 1Mettre en place le HTML
05m53s
Leçon 2Mettre en place le CSS de l'élément #louer
09m33s
Leçon 3Mettre en place le CSS de l'élément #modale
08m43s
Leçon 4Mettre en place le jQuery pour faire apparaître et disparaître la modale
05m53s
Leçon 5Donner un effet à la modale
04m41s
Leçon 6Baisser l'opacité du fond de l'écran
06m24s
Leçon 7Conclusion
01m43s

Aperçus

Avis des apprenants

Détail des avis
4
Apprenants
4
Commentaires
5/5
Note moyenne
5/5
4
4/5
0
3/5
0
2/5
0
1/5
0
Valérie Arno
Valérie Arno
Publié le 25/06/2023
Une modale moderne plutôt agréable. L'astuce de mettre les dimensions à 0 dans le script est astucieux pour un meilleur rendu de la descente et de la remontée. Facile à établir quand on a compris le processus. Merci Carl.
Carl Brison
Carl Brison
Merci beaucoup Valérie ;-)
Alain Tardif
Alain Tardif
Publié le 03/06/2023
Bonsoir et merci pour la suite de cette série de tutos sur JQuery, c'est un vrai plaisir. Validé 100% #2/5
Carl Brison
Carl Brison
Merci beaucoup Alain, et très ravi de vous retrouver ;-)
Bernard Chabloz
Bernard Chabloz
Publié le 01/06/2023
Merci pour ce #2. Le #3 m'appelle...
Carl Brison
Carl Brison
Merci beaucoup ;-)))

Vos questions sur le cours

Avec quelle version de logiciel ce tuto est-il compatible ?

jQuery

Que contient le fichier source ?

Le code complet de ce tuto

Quel est le niveau requis pour suivre ce tuto ?

débutant

Attendez ! 🤗

Accédez à plus de 1330 tutos gratuits

Notre politique de protection des données