鼠标经过出现的提示效果，比title更漂亮，可订制。
js：
复制代码 代码如下:
//---------------------------tooltip效果 start-----------------------------------
//获取某个html元素的定位
function getpos(obj){
var pos=new object();
pos.x=obj.offsetleft;
pos.y=obj.offsettop;
while(obj=obj.offsetparent){
pos.x+=obj.offsetleft;
pos.y+=obj.offsettop;
}
return pos;
};
//提示工具
var tooltip={
_tippanel:null,
init:function(){
if(null==this._tippanel){
var tempdiv=document.createelement(div);
document.body.insertbefore(tempdiv, document.body.childnodes[0]);
tempdiv.id=tippanel;
tempdiv.style.display=none;
tempdiv.style.position=absolute;
tempdiv.style.zindex=999;
}
},
attachtip:function(){}, //添加提示绑定
detachtip:function(){}, //移除提示绑定
showtip:function(otarget){
if($(tippanel)==null)
return;
/*操作流程
*1、构建新的html片段
*2、设置提示框新位置
*3、显示提示框
*/
//1.
var tempstr=; //html片段
if(arguments.length>1){
for(var i=1;itempstr+=+arguments[i]+
;
}
}
$(tippanel).innerhtml=tempstr;
//2.
var pos=getpos(otarget);
$(tippanel).style.left=(otarget.offsetwidth/2+pos.x)+px;
$(tippanel).style.top=(otarget.offsetheight+pos.y)+px;
//3.
$(tippanel).style.display=;
},
hidetip:function(){
if($(tippanel)==null)
return;
$(tippanel).style.display=none;
}
};
//---------------------------tooltip效果 end-----------------------------------
css：
复制代码 代码如下:
#tippanel{ background:white; padding:6px 8px; width:300px; border:solid 4px #09c; font-size:14px; color:#555;}
#tippanel p{ margin:0px;}
#tippanel b{ color:red; font-size:14px;}
html调用：
复制代码 代码如下:
使用效果：
上面的$(id)作用等价于document.getelementbyid(id)
attachtip:function(){}, //添加提示绑定
detachtip:function(){}, //移除提示绑定
这两行，可以用动态绑定事件完成，因为项目里面用不着，所以暂时没加