super simple css tooltips

Super einfache CSS -Tooltips

Fügen Sie ein Element einfach einen Tooltip -Schweber hinzu. Der Tooltip -Schwebes kann links, rechts oder unten in einem Element platziert werden. Eine zweite Option unten enthält einen Zeiger.

CSS -Klassen

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

Verwendung

Das CSS nimmt jedes Element mit einer tooltip--* Klasse an und verwendet das data-tooltip -Attribut im Element, um den Tooltip-Text bereitzustellen.

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

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

Unterstützung

Aktuelle Versionen von Chrome, Firefox, Safari, Edge und IE10+.