分享一个我自己写的ToolTip提示插件（附源码）

继续分享一个我自己写的 ToolTip提示插件，希望大家支持我，给我点评论，哪怕骂我的也好啊，让我知道有人在关注我“小豆” 嘿嘿。废话不多说上代码！
复制代码代码如下:
$.fn.ToolTip = function （option） {
var defaults = {
direction: "down",
star: function （） { },
from: $（this）,
url: "../images/arrow.png"
};
//方法内基础变量
var opt = $.extend（defaults, option）,
dirarray = ["up", "down", "left", "right"],
left = 0, top = 0, _left = 0, _top = 0, arrow_w = 15, arrow_h = 60, timeout, arrow = "0 0";
//开始遍历
$（this）.each（function （） {
var obj = $（this）;
obj.on（{
mouseenter: function （） {
GetPos（obj）;
var objtip = $（"<div class="tooltip"></div>"）.css（{
position: "absolute",
top: top,
left: left,
border: "solid 1px #ccc",
width: $（"#" + obj.attr（"data-tooltip"））.outerWidth（true）,
height: $（"#" + obj.attr（"data-tooltip"））.outerHeight（true）,
"border-radius": "8px 8px",
"background-color": "#fff",
"z-index": 999
}）.appendTo（obj）;
var objtiphead = $（"<div></div>"）.css（{
width: arrow_w == 30 ？ objtip.outerWidth（true） : 15,
height: arrow_h == 30 ？ objtip.outerHeight（true） : 15,
position: "absolute",
top: _top,
left: _left
}）.appendTo（objtip）;
var objtiparrow = $（"<div></div>"）.css（{
width: arrow_w,
height: arrow_h,
"background-image": "url（" + opt.url + "）",
"background-repeat": "no-repeat",
"background-position": arrow
}）.appendTo（objtiphead）;
objtip.append（$（"#" + obj.attr（"data-tooltip"））.clone（）.show（））;
objtip.on（{
mouseenter: function （） {
obj.data（{
attip: true
}）;
}, mouseleave: function （） {
$（".tooltip"）.remove（）;
obj.removeData（"attip"）;
}
}）;
}
, mouseleave: function （） {
if （！obj.data（"attip"））
$（".tooltip"）.remove（）;
obj.removeData（"attip"）;
}
}）;
}）;
//得出位置
var GetPos = function （obj） {
var objtip = $（"#" + obj.attr（"data-tooltip"））;
var tooltippos = {
up: function （） {
arrow_w = 30; arrow_h = 15;
top = obj.position（）.top - 12 - objtip.outerHeight（true）;
left = obj.position（）.left;
_top = objtip.outerHeight（true）;
_left = 15;
arrow = "-50px -50px";
},
down: function （） {
arrow_w = 30; arrow_h = 15;
top = obj.position（）.top + 12 + obj.height（）;
left = obj.position（）.left;
_top = -15;
_left = 15;
arrow = "-50px 0";
},
right: function （） {
arrow_w = 15;
arrow_h = 30;
top = obj.position（）.top;
left = obj.position（）.left - 12 - objtip.outerWidth（true）;
_top = 15;
_left = objtip.outerWidth（true）;
arrow = "-80px -20px";
},
left: function （） {
arrow_w = 15;
arrow_h = 30;
top = obj.position（）.top;
left = obj.position（）.left + obj.width（） + 12;
_top = 15;
_left = -15;
arrow = "0 -20px";
}
};
opt.star（）;
opt.direction = $.inArray（opt.direction, dirarray）！= -1 ？ opt.direction : "down";
switch （opt.direction） {
case "up":
if （obj[0].getBoundingClientRect（）.top - 10 - objtip.outerHeight（） > 0）
tooltippos.up（）;
else
tooltippos.down（）;
break;
case "down":
if （obj[0].getBoundingClientRect（）.top + 10 + obj.height（） + objtip.outerHeight（） < $（window）.height（））
tooltippos.down（）;
else
tooltippos.up（）;
break;
case "right":
if （obj[0].getBoundingClientRect（）.left - 10 - objtip.outerWidth（） > 0）
tooltippos.right（）;
else
tooltippos.left（）;
break;
case "left":
if （obj[0].getBoundingClientRect（）.left + obj.width（） + 10 + objtip.outerWidth（） < $（window）.width（））
tooltippos.left（）;
else
tooltippos.right（）;
}
}
}

经测试，好像IE7 箭头有指向错误，大家可以修改下。小问题啦，洒洒水啦~
效果图：

当然，里面是什么内容，那就要自己创造了，我只是写了一个展示div，用法很简单的。
源码下载
操作说明是对用户体验师的侮辱！