js 增强型title信息提示效果
效果图:
演示代码:
.xstooltip
{
visibility: hidden;
position: absolute;
top: 0;
left: 0;
z-index: 2;
font: normal 8pt sans-serif;
padding: 3px;
border: solid 1px;
}
显示注释
jb51www.jb51.net
Time spent: 00:00:08
Page viewed: 4
Browser: Mozilla – 1.7.11
Operating system: Linux - i686 (x86_64)
function xstooltip_findPosX(obj)
{
var curleft = 0;
if (obj.offsetParent)
{
while (obj.offsetParent)
{
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
}
else if (obj.x)
curleft += obj.x;
return curleft;
}
function xstooltip_findPosY(obj)
{
var curtop = 0;
if (obj.offsetParent)
{
while (obj.offsetParent)
{
curtop += obj.offsetTop
obj = obj.offsetParent;
}
}
else if (obj.y)
curtop += obj.y;
return curtop;
}
function xstooltip_show(tooltipId, parentId, posX, posY)
{
it = document.getElementById(tooltipId);
if ((it.style.top == '' || it.style.top == 0)
&& (it.style.left == '' || it.style.left == 0))
{
// need to fixate default size (MSIE problem)
it.style.width = it.offsetWidth + 'px';
it.style.height = it.offsetHeight + 'px';
img = document.getElementById(parentId);
// if tooltip is too wide, shift left to be within parent
if (posX + it.offsetWidth > img.offsetWidth) posX = img.offsetWidth - it.offsetWidth;
if (posX
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]