article(s) dans votre panier VOIR

Afficher des tooltip et popover dans votre contenu

  • Vidéo 20 sur 23
  • 2h58 de formation
  • 23 leçons

Un contenu flash devrait s'afficher ici. Votre navigateur ne comporte pas de plugin flash, ou il ne s'est pas correctement initialisé.

Vous pouvez télécharger le plugin flash depuis le site d'Adobe à l'adresse suivante : http://get.adobe.com/flashplayer/.

Pour accéder à la suite de cette formation, vous devez vous abonner.
previous
summary
resume
next
play
Afficher des tooltip et popover dans votre contenu
00:00 / 08:36
HD
fullscreen
Je m’abonne
à partir de 16,6 € / mois
  • Visionnage en ligne
  • Accès illimité à toutes nos formations
OU
J'achète uniquement
la formation
39,90€
  • Téléchargement + VOD à vie
  • Exercice / Validation des acquis
  • Accès uniquement à cette formation

Sommaire de la formation

Détails de la formation

Dans ce tuto vidéo, Guillaume Vergano vous apprend comment afficher des tooltip et popover dans votre contenu avec Bootstrap. Ces plugins sont utiles pour afficher des informations supplémentaires sur des éléments contenus sur votre site web. Pour ce faire, vous choisissez d’abord le placement de l’information supplémentaire. Ensuite, vous allez dans le code HTML pour ajouter de nouveaux articles. Dans ce code, vous placez en dessus de la pagination et vous créez une nouvelle Div . Vous inscrivez les codes spécifiques de cette nouvelle Div et vous sauvegardez le tout . Vous constatez sur le site que les articles sont visibles. C’est sur ces articles que vous affinez les tooltips et le popover. Pour y arriver, vous retournez sur le code HTML et vous vous positionnez sur le titre. Avec l’outil « data-attribute », vous définissez les tooltips du titre, son comportement, son placement et son contenu. Après sauvegarde, vous remarquez que rien n’est visible sur le site web. Afin de régler ce problème, il vous faut activer le plugin via JavaScript. Vous inscrivez en premier les codes JavaScript et vous attribuez ensuite la fonction des éléments dans . Sur la page web, vous apercevez qu’en survol du titre, le plugin apparait. À part le tooltip, vous affichez une popover sur un autre titre. Pour y accéder, vous créez un Span dans lequel vous mettez le titre. Suite à ce Span, vous attribuez les mêmes fonctionnalités que le tooltip. Ainsi, le popover apparait sur le titre de l’article. Au final, des sous-titres viennent s’ajouter à vos titres pour bien illustrer chaque page d’articles sur votre site web.