super simple css tooltips

Intimes à outils CSS super simples

Ajoutez facilement une info-bulle survole à un élément. Le survol de l'info-bulle peut être placé vers la gauche, la droite ou le bas d'un élément. Une deuxième option inférieure comprend un pointeur.

Cours CSS

• tooltip--left
• tooltip--right
• tooltip--bottom
• tooltip--triangle

Usage

Le CSS prend n'importe quel élément qui a une classe tooltip--* et utilise l'attribut data-tooltip sur l'élément pour fournir le texte de l'info-bulle.

[ class ^= "tooltip" ] {
  ...
  content : attr ( data-tooltip );
  ...
}

 < img href =" /img/info.svg " class =" tooltip--left " data-tooltip =" This is the text displayed " >

Soutien

Versions actuelles de Chrome, Firefox, Safari, Edge et IE10 +.