鼠标移过去就显示的JS代码

来源:互联网 发布:mac os update 编辑:程序博客网 时间:2024/04/29 15:49

<span onmouseover="showdes()">showdes</span>

<div style="position:absolute;font-size:9pt;background-color:#F1FAF7;width:150;display:none" id="des"></div>

function showdes(){

 var obj=event.srcElement.parentElement.children(5);
 var obj2=event.srcElement.parentElement.children(3);
 if(obj!=null||obj2!=null){
  if(obj.innerText!=""||obj2.innerText!=""){
   document.getElementById('des').style.display="block";
   document.getElementById('des').innerHTML="<table border=1 bordercolor=black width=150><tr><td style='white-space:normal;padding:5pt'>"+obj2.innerText+obj.innerText+"</td></tr></table>";
   x=event.clientX;
   y=event.clientY;
   var bwidth=document.body.offsetWidth;
   if((x+150)>bwidth){
    x=x-150;
   }
   document.getElementById('des').style.top=y+5;
   document.getElementById('des').style.left=x+5;
  }
  else{
   document.getElementById('des').style.display="none";
  }
 }
 event.cancelBubble=true;
}

document.body.attachEvent("onmouseover",closedes);

function closedes(){
 document.getElementById('des').style.display="none";
}

 

 

更简单的方法:<span title="no des">blockname</span>  用title就可以代替以上的代码了

原创粉丝点击