How to Use tooltips

Simply include spiketip.min.css into your HTML:

<link rel="stylesheet" href="path/to/spiketip.css">

Alternatively, you can use it via CDN (provided by jsdelivr):

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/spiketip-tooltip@1.0.6/spiketip.min.css">

And add the attributes spiketip-title and spiketip-pos to your HTML elements:

<button spiketip-title="I'm a SpikeTip tooltip!" spiketip-pos="top">Hover Me!</button>

installation using npm

npm install spiketip-tooltip
import 'spiketip-tooltip/spiketip.min.css';

Position your tooltips

Position Code Demo
Top spiketip-pos="top"
Bottom spiketip-pos="bottom"
Right spiketip-pos="right"
Left spiketip-pos="left"
Top-Right spiketip-pos="top-right"
Top-Left spiketip-pos="top-left"
Bottom-Right spiketip-pos="bottom-right"
Bottom-Left spiketip-pos="bottom-right"

Color your tooltips

Color Code Demo
Success spiketip-color="success"
Error spiketip-color="error"
Warning spiketip-color="warning"
info spiketip-color="info"

Size your tooltips

Size Code Demo
Small spiketip-length="sm"
Medium spiketip-length="md"
Large spiketip-length="lg"
Extra Large spiketip-length="xl"
Auto spiketip-length="auto"