文本/链接
纯CSS Tooltips工具提示特效库
PetitQ
tootik 是一款纯 CSS Tooltips 工具提示特效库。该工具提示效果使用 CSS3/SASS 来制作，支持使用 data 属性来配置 tooltips 的位置和属性，效果非常炫酷。
使用方法
在页面中引入 tootik.min.css 文件。
也想出现在这里？联系我们吧
<link rel="stylesheet" href="path/to/tootik.min.css">
HTML 结构
在你需要显示 tooltips 的元素上添加 data-tootik 属性。
<span data-tootik="...">...</span>
你还可以通过 data-tootik-conf 属性来设置 tooltips 的位置和参数。
<span data-tootik="..." data-tootik-conf="...">...</span>
位置属性
<span data-tootik="...">Top</span>
<span data-tootik="..." data-tootik-conf="right">Right</span>
<span data-tootik="..." data-tootik-conf="bottom">Bottom</span>
<span data-tootik="..." data-tootik-conf="left">Left</span>
情景类型
<span data-tootik="..." data-tootik-conf="invert">invert</span>
<span data-tootik="..." data-tootik-conf="success">success</span>
<span data-tootik="..." data-tootik-conf="info">info</span>
<span data-tootik="..." data-tootik-conf="warning">warning</span>
<span data-tootik="..." data-tootik-conf="danger">danger</span>
特性
<span data-tootik="..." data-tootik-conf="shadow">shadow</span>
<span data-tootik="..." data-tootik-conf="delay">delay</span>
<span data-tootik="..." data-tootik-conf="multiline">multiline</span>
<span data-tootik="..." data-tootik-conf="no-fading">no-fading</span>
<span data-tootik="..." data-tootik-conf="no-arrow">no-arrow</span>
<span data-tootik="..." data-tootik-conf="square">square</span>
Github 地址：https://github.com/eliorshalev/tootik
| 演示地址 | 下载地址 |
专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务，详询在线客服！
也想出现在这里？联系我们吧
