CATALOGUE Code & Data Formation XHTML/CSS Maîtriser Materialize CSS - Le framework pour le Material Design Comment ajouter des tooltips à un formulaire

Comment ajouter des tooltips à un formulaire

Tooltips
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Maîtriser Materialize CSS - Le framework pour le Material Design
Revoir le teaser Je m'abonne
Transcription
Cette leçon fait partie de la formation
49,90€ Paiement unique • Accès à vie Acheter cette formation

Formation incluse dans l'abonnement Elephorm

Je m'abonne à Elephorm
DescriptionProgrammeAvis
Cette leçon fait partie de la formation
49,90€ Paiement unique • Accès à vie Acheter cette formation

Formation incluse dans l'abonnement Elephorm

Je m'abonne à Elephorm

Étapes détaillées pour intégrer des tooltips

Objectifs

Les objectifs de cette vidéo incluent :

  • Apprendre à intégrer des tooltips dans un formulaire.
  • Comprendre l'utilisation des data elements.
  • Configurer efficacement les positions et délais des tooltips.

Résumé

Découvrez comment ajouter des tooltips à vos formulaires en quelques étapes simples.

Description

Dans cette leçon, vous apprendrez à intégrer des tooltips dans vos formulaires pour améliorer l'expérience utilisateur. Nous allons aborder les différentes classes et data elements nécessaires pour configurer ces tooltips, ainsi que leurs positions et délais d'affichage. Vous aurez une vue d'ensemble sur la manière de les adapter pour différents champs de formulaire comme les noms et les e-mails.

Cela inclut :

  • L'ajout de la classe tooltips (attention, deux 'P').
  • La configuration des data elements tels que data-position (top, bottom, left, right), data-delay et data-tooltip.
  • Un exemple concret pour configurer un tooltip avec le texte 'Remplissez votre nom svp' et un autre pour l'email.

À la fin de cette leçon, vous serez capable de personnaliser les tooltips pour n'importe quel champ de formulaire.

Voir plus

Questions fréquentes

Que doit-on ajouter à un champ de formulaire pour afficher un tooltip?
Il est nécessaire d'ajouter la classe tooltips ainsi que les data elements appropriés.
Quelles sont les options de positionnement pour un tooltip?
Les options de positionnement pour un tooltip sont top, bottom, left et right.
Quelle est l'utilité du data element <code>data-delay</code>?
Le data element data-delay détermine le délai avant lequel le tooltip apparait à l'écran après un clic sur l'élément de formulaire.