更新时间：2019-12-27 00:16:09
更新说明：更换DOM结构中的属性名：
tip改为data-tip
direction改为data-direction
更新时间：2019-12-25 00:25:37
更新说明：解决IE浏览器兼容性问题
更新时间：2019-12-23 22:54:11
更新说明：
1. 修复上个版本中IE兼容性BUG
2. 添加tooltip显示与消失的过渡效果
3. 添加yooltip显示与消失的回调函数
新版使用说明：
1 2 3 | tooltip('.item');tooltip('.item', null, enterCallback, outCallback);tooltip('.item', ｛transition: true｝, enterCallback, outCallback);tooltip('.item', ｛transition: true, time: 200｝, enterCallback, outCallback); |
参数：
1. '.item'：需要添加tooltip提示的目标元素，必填项；若只给一个元素添加tooltip，可以使用id
2. ｛transition: true[, time: 1000]｝: 过度效果，transition：是否添加过度效果，time：过度效果的持续时间（单位为毫秒，默认为200毫秒）
3. enterCallback：tooltip显示时的回调函数
4. outCallback：tooltip消失时的回调函数
具体使用示例见demo
tooltip
效果类似bootstrap的tooltip
使用方法
1.引入tooltip.js和style.css文件
1 2 | <link rel="stylesheet" href="style.css"><script src="tooltip.js"></script> |
2 DOM结构中
1 2 3 4 5 | <!-- tip：tooltip提示框中的文本内容；direction：tooltip提示框的位置，可选值为top/right/bottom/left --><li class="item" tip="Tooltip-top" direction="top">top</li><li class="item" tip="Tooltip-right" direction="right">right</li><li class="item" tip="Tooltip-bottom" direction="bottom">bottom</li><li class="item" tip="Tooltip-left" direction="left">left</li> |
tip：tooltip提示的文本内容
direction: tooltip的位置，可选值为top/right/bottom/left
3.JS中 tooltip(ele) ele：元素的class，必填项，若只给一个元素添加tooltip，可以使用id
1 | tooltip('.item'); |
特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com
- 上一个特效： 响应式手机app类网站模板
- 下一个特效： jQuery自定义生成鱼骨图（时间趋势图）