JSFiddle - React, Tailwind, and code Playground
HTML
<a class="hastipz" id="num3" href="#">
alignTo:'cursor',<br />
showEvent:'mousemove'
</a>
<div class="showtip">
TOOLTIP3
</div>
CSS
div.showtip{display:none;}
#num3{
position:absolute;
background-color:red;
padding:100px;
top:290px;
left:0;
}
JavaScript
/* tooltipsy by Brian Cray
* Lincensed under GPL2 - http://www.gnu.org/licenses/gpl-2.0.html
* Option quick reference:
* - alignTo: "element" or "cursor" (Defaults to "element")
* - offset: Tooltipsy distance from element or mouse cursor, dependent on alignTo setting. Set as array [x, y] (Defaults to [0, -1])
* - content: HTML or text content of tooltip. Defaults to "" (empty string), which pulls content from target element's title attribute
* - show: function(event, tooltip) to show the tooltip. Defaults to a show(100) effect
* - hide: function(event, tooltip) to hide the tooltip. Defaults to a fadeOut(100) effect
* - delay: A delay in milliseconds before showing a tooltip. Set to 0 for no delay. Defaults to 200
* - css: object containing CSS properties and values. Defaults to {} to use stylesheet for styles
* - className: DOM class for styling tooltips with CSS. Defaults to "tooltipsy"
* - showEvent: Set a custom event to bind the show function. Defaults to mouseenter
* - hideEvent: Set a custom event to bind the show function. Defaults to mouseleave
* More information visit http://tooltipsy.com/
*/
(function($){
$('.showtip').css("display","none");
$.tooltipsy = function (el, options) {
/*
*/
//
//This is what defines the content of the tooltip.
//It needs to be changed to specify the div.showtip
//nearest to the anchor being hovered over
var showtip = $(el).nextAll(".showtip").html();
/*
*/
this.options = options;
this.$el = $(el);
this.title = showtip || '';
this.$el.attr('title', '');
this.random = parseInt(Math.random()*10000);
this.ready = false;
this.shown = false;
this.width = 0;
this.height = 0;
this.delaytimer = null;
this.$el.data("tooltipsy", this);
this.init();
};
$.tooltipsy.prototype.init = function () {
var base...