JAVASCRIPT 动态TIP 提示

来源:互联网 发布:怎么才能成为淘宝鉴定 编辑:程序博客网 时间:2024/04/29 06:10

  <td class="font_style" onmouseover="tipShow(this)" onmouseout="hideTip(this)"  tipsId='动态的VALUE'></td>


function tipShow(obj,e){
if(obj){
var  tipsId = obj.getAttribute(" tipsId");
var _tips = document.getElementById(tipsId); 
var px;
var py;
if(typeof(event)=="undefined"){  
px = e.clientX;
py = e.clientY;
}else{  
e = event;  
px = e.clientX;
py = e.clientY;
}
//如果存在就显示,否则创建
if(_tips!=null){  
_tips.style.display="";  
}else{
//发送请求获得数据
                     //Ajaxw请求:
                        if(success){
                        message = response.responseText;
                        createTip(tipsId,message,px,py);//创建新的TIP
                            }else{alert(请求失败!)}
}  
}
};
function createTip(tid,tip,px,py){
if(tip.length>0){
var _tips = document.getElementById(tid);
if(typeof(_tips)=="undefined"||_tips == null){
_tips     = document.createElement("div");  
        _tips.id  = tid;  
        _tips.value  = tip;  
        _tips.style.position        = "absolute";  
        _tips.style.width           = "150px";  
        _tips.style.borderWidth     = "1px";  
        _tips.style.borderStyle     = "solid";  
        _tips.style.borderColor     = "gray";  
        _tips.style.fontSize        = "9pt";  
        _tips.style.backgroundColor = "#C7D6E9";  
        _tips.style.color           = "#000000";  
        _tips.style.filter          = "progid:DXImageTransform.Microsoft.Shadow(color=#999999,direction=135,strength=3)";  
        _tips.style.padding         = "5px 8px 3px 8px";  
        document.body.appendChild(_tips);              
        _tips.style.display            = "none";  
}
_tips.style.display = "";         
        _tips.innerHTML     = tip;  
        _tips.style.left = document.body.scrollLeft + px + 10;   
        _tips.style.top  = document.body.scrollTop  + py + 10;   
}
};
function hideTip(obj){
//alert("hideTip");
if(obj){
var  tipsId = obj.getAttribute("tipsId");
var _tips = document.getElementById(tipsId); 
if(_tips!=null){  
_tips.style.display="none";  
}
}
};


原创粉丝点击