简介
darktooltip 是一个基于 jQuery 的轻量级工具提示插件，提供了一种简单且灵活的方式来创建漂亮的工具提示。它可用于展示出错信息、透露更多细节以及其他类似的场景。
安装
可以通过 npm 来安装 darktooltip，执行以下命令即可：
npm install darktooltip
如果你在浏览器中使用该插件，则需要先下载并引入 jQuery 库和 darktooltip 文件，代码如下：
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <link href="path/to/darktooltip.css" rel="stylesheet"> <script src="path/to/darktooltip.js"></script>
使用
基本用法
在 HTML 元素上添加 data-tooltip 属性来创建工具提示，如下所示：
<button data-tooltip="Hello, world!">Hover me</button>
然后在 JavaScript 中调用 darkTooltip() 方法即可：
$(document).ready(function(){
$('body').darkTooltip();
});此时，当鼠标悬停在按钮上时，会显示 Hello, world! 工具提示。
自定义选项
darktooltip 还提供了许多自定义选项，可以根据实际需求进行配置。以下是几个常见的选项：
animation：设置工具提示的动画效果，默认为"fade"。gravity：设置工具提示的位置，可选值包括"n","s","e","w","ne","nw","se","sw"等。theme：设置工具提示的主题，可选值包括"light"和"dark"。opacity：设置工具提示的透明度，默认为0.9。
可以在调用 darkTooltip() 方法时传入这些选项，如下所示：
$(document).ready(function(){
$('body').darkTooltip({
animation: 'slide',
gravity: 'n',
theme: 'dark',
opacity: 0.7
});
});事件回调
darktooltip 还提供了一些事件回调函数，可以在工具提示显示和隐藏时执行自定义操作。以下是几个常见的事件回调：
onShow：当工具提示显示时触发。onHide：当工具提示隐藏时触发。onBeforeShow：在显示工具提示之前触发。onBeforeHide：在隐藏工具提示之前触发。
可以通过向 darkTooltip() 方法传递一个对象来注册事件回调函数，如下所示：
-- -------------------- ---- -------
-----------------------------
-----------------------
------- -----------
-------------------- -- ---------
--
------- -----------
-------------------- -- ----------
-
---
---示例代码
以下是一个完整的示例，演示了如何使用 darktooltip 创建工具提示：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
------------------ ------------
----- ------------------------------------------------------------------------ -----------------
-------
------ -
------------- -----
-
--------
-------
------
------- ------------------ -- - ----- --------- ------------------------ ----------------
------- ------------------ -- - ---- --------- ---------------------- ----------------
------- ------------------ -- - ------- ---- ----- ----------- ---------------------------- ----------------
------- ------------------ -- - ------- -- --- ----- -------------------- ----------------
------- ------------------ -- - ------- ---- ------ --------- ------------------------- ------- ---------------
- ----------------------------------------------------------- --------
----------------------------------------------------------------------------------