https://pubhtml5.com/js/utils/jquery.hints.js?1b8c7ff7ba030c97bf161b337981e0c5

1/**
2 * @author Ares_P
3 * @type jQuery tooltip plugin
4 * @version 1.0.0
5 */
6(function ($) {
7    $.fn.hints = function (options) {
8
9        var defaults = {
10            className: "",
11            addClass: "",
12            content: null,
13            position: "topRight",
14            offsetX: 5,
15            offsetY: -5,
16            overCallback: null
17        };
18
19        var settings = $.extend({}, defaults, options);
20
21        return this.each(function () {
22            var $this = $(this),
23                $hint = $("<div></div>").css({
24                    position: "absolute",
25                    display: "none",
26                    zIndex: "999999999"
27                }).appendTo($("body")),
28                outTimeoutId = null;
29
30            if (settings.content) {
31
32                if (typeof settings.content === "object") {
33                    $(settings.content).css("display", "block");
34                }
35
36                $hint.append(settings.content);
37            }
38
39            if (settings.className) {
40                $hint.addClass(settings.className);
41            } else {
42                $hint.css({
43                    border: "1px solid #f9d52f",
44                    background: "#ffffce",
45                    color: "#222222",
46                    borderRadius: "2px",
47                    boxShadow: "rgb(112, 112, 112) 0px 1px 1px",
48                    padding: "8px 12px",
49                    fontSize: "13px",
50                    maxWidth: "450px"
51                });
52            }
53
54            if (settings.addClass) {
55                $hint.addClass(settings.addClass);
56            }
57
58            $this.hover(function (e) {
59                clearTimeout(outTimeoutId);
60
61                if (settings.overCallback) {
62                    settings.overCallback();
63                }
64
65                var targetLeft = $this.offset().left,
66                    targetTop = $this.offset().top,
67                    targetHeight = $this.outerHeight(),
68                    targetWidth = $this.outerWidth(),
69                    hintHeight = $hint.outerHeight(),
70                    hintWidth = $hint.outerWidth(),
71                    top,
72                    left;
73
74                switch (settings.position) {
75                    case "topRight":
76                        left = targetLeft + targetWidth;
77                        top = targetTop - hintHeight;
78                        break;
79                    case "top":
80                        left = targetLeft + (targetWidth - hintWidth) / 2;
81                        top = targetTop - hintHeight;
82                        break;
83                    case "bottom":
84                        left = targetLeft + (targetWidth - hintWidth) / 2;
85                        top = targetTop + hintHeight;
86                        break;
87                    case "right":
88                        left = targetLeft + targetWidth;
89                        top = targetTop + (targetHeight - hintHeight) / 2;
90                        break;
91                    case "mouse":
92                        left = e.pageX;
93                        top = e.pageY;
94                        break;
95                }
96
97                $hint.css({
98                    left: left + settings.offsetX,
99                    top: top + settings.offsetY
100                }).fadeIn(200);
101
102                if (settings.position === "mouse") {
103                    $(document).on("mousemove", $this, function (e) {
104                        $hint.css({
105                            left: e.pageX + settings.offsetX,
106                            top: e.pageY + settings.offsetY
107                        });
108                    });
109                }
110
111            }, function () {
112                outTimeoutId = setTimeout(function () {
113                    $hint.stop().fadeOut(200);
114                }, 200);
115            });
116
117            $hint.hover(function () {
118                clearTimeout(outTimeoutId);
119                $hint.fadeIn(0);
120            }, function () {
121                $hint.stop().fadeOut(200);
122            });
123        });
124    }
125
126    // $(window).on('load.hf.hints', function () {
127    $(function() {
128        console.log("===========1")
129        $.each($(document).find("[data-toggle=hints][data-hint-title!='']"), function (index, item) {
130            var $self = $(item);
131            $self.hints({
132            //     title: $self.attr("data-hint-title"),
133            //     placement: $self.attr("data-hint-placement") || "top",
134
135
136            //     content: null,
137            // position: "topRight",
138            // offsetX: 5,
139            // offsetY: -5,
140
141                position: $self.attr("data-hint-placement") || "topRight",
142                offsetX: $self.attr("data-hint-offsetX") || 5,
143                offsetY: $self.attr("data-hint-offsetY") || -5,
144                content: $self.attr("data-hint-title")
145            });
146        });
147    });
148})(window.jQuery);
149