iTooltip
The JavaScript library let’s you transform native tooltip’s into customizable overlays.
Use:
<script src="/path/to/iTooltip.js"></script>
<script>
var tooltip = new iTooltip();
tooltip.init();
</script>
Change selector:
var tooltip = new iTooltip('.my-selector')
tooltip.init()
Set options:
var tooltip = new iTooltip()
tooltip.init({
className: 'my-class-name',
indentX: 3,
indentY: 3,
positionX: 'left',
positionY: 'center'
})
Options:
- className - Sets the class name for a block with a hint. Default: 'tooltip';
- indentX - Horizontal indent from the cursor (in pixels). Default: 10;
- indentY - Vertical indent from the cursor (in pixels). Default: 15;
- positionX - The initial position of the tooltip horizontally. Default: 'right'. Variants: 'left', 'right', 'center';
- positionY - The initial position of the tooltip vertically. Default: 'bottom'. Variants: 'top', 'bottom', 'center';
WARNING! positionX and positionY can not simultaneously have the value "center".
Change the style for the tooltip:
.tooltip { /* or your class if changed */
background-color: #282c34;
color: #98c379;
/* other styles */
}
17 Sep 27, 2022
39 Dec 24, 2022
22 Jul 27, 2022
6.8k Jan 5, 2023
4 Mar 4, 2022
27 Dec 27, 2022
6 Aug 4, 2022
4 Dec 7, 2022
213 Nov 5, 2022
96 Dec 27, 2022
9 Jul 21, 2022
9 Sep 23, 2022
28 Nov 26, 2022
299 Dec 21, 2022
4 Dec 11, 2022
3 Sep 19, 2022
40 Dec 18, 2022
5 Mar 29, 2022