1.6.4 • Published 11 months ago
tooltip-enhance v1.6.4
Tooltip
fork from github.com/radubrehar/tooltip
Install
$ npm install tooltip --save
Usage
var tooltip = require("tooltip");
tooltip();
<h2 data-tooltip="tooltip text">Test the tooltip</h2>
Now hover over h2 and the tooltip will show.
Or, with config:
var tooltip = require("tooltip");
var config = {
showDelay: 100,
style: {
padding: 5,
},
};
tooltip(config);
Configs
- target - defaults to
document.documentElement
. Tooltips will be displayed only for elements inside target. - style - styles to be applied to the tooltip element
- className - a css class to be applied to the tooltip element. Defaults to
"tooltip"
- showDelay - defaults to
500
ms - visibleStyle - style to be applied to the tooltip element when it is visible
- hiddenStyle - style to be applied to the tooltip element when it is hidden
- appendTooltip: Function - a function to append the tooltip (defaults to doing
document.body.appendChild(tooltipElement)
) - offset - defaults to { x: 5, y: 5 }
attrName - defaults to
"data-tooltip"
. Tooltip will show on hover over elements with this attribute.Specify
data-tooltip-positions="top;bottom;left;right"
to dictate the order of the positions preferred by the tooltip.