Mise en place d'une infobule avec jQuery et Materialize.css
Objectifs
Les objectifs de cette vidéo sont :
- Apprendre à intégrer des infobulles de rappel à un formulaire web.
- Utiliser les plugins toasts et scroll fires de Materialize.css.
- Comprendre la configuration et l'utilisation du paramètre offset.
Résumé
Dans ce tutoriel, découvrez comment ajouter une infobule de rappel à un formulaire web en utilisant jQuery et Materialize.css.
Description
Dans cette leçon, nous allons explorer l'ajout d'une infobule de rappel dans un formulaire web. L'objectif principal est de créer une petite fenêtre contextuelle sur la droite de l'écran, indiquant aux utilisateurs qu'il serait bénéfique de nous contacter avant de quitter la page.
Nous commencerons par ajouter un élément div juste avant le formulaire. Ce formulaire, pour être pleinement fonctionnel, nécessiterait l'ajout de fonctions AJAX permettant l'envoi de courriels. Ensuite, nous insérerons du code jQuery pour gérer l'affichage de cette infobule.
Nous allons utiliser deux plugins JavaScript de Materialize.css : les toasts et les scroll fires. Les toasts permettent de faire apparaître des messages contextuels suite à une action utilisateur, tandis que les scroll fires déclenchent des événements lorsqu'une certaine distance de défilement est atteinte.
Nous configurerons notamment le paramètre offset pour ajuster la distance de défilement nécessaire avant l'apparition de l'infobule. À la fin de cette leçon, vous serez capable d'implémenter des infobulles de rappel efficaces dans vos projets web, en améliorant ainsi l'interaction utilisateur.
Questions - réponses
Programme détaillé
Module 1 - Materialize css
Module 2 - Un site en materializecss
