1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 2 <html> 3 <head> 4 <title> New Document </title> 5 </head> 6 <style type="text/css"> 7 td {cursor:pointer} 8 #popmenu {display:none;position:absolute;padding:5px;border:1px solid black;background-color:white} 9 </style> 10 <body> 11 <table> 12 <tr> 13 <td>第一行</td> 14 <td>第一行</td> 15 </tr> 16 <tr> 17 <td>第二行</td> 18 <td>第二行</td> 19 </tr> 20 <tr> 21 <td>第三行</td> 22 <td>第三行</td> 23 </tr> 24 </table> 25 <div id="popmenu"> 26 开发中心--技术部--北京总部 27 </div> 28 </body> 29 <script type="text/javascript"> 30 var menu=document.getElementById("popmenu"); 31 var trs=document.getElementsByTagName("tr"); 32 for(i=0;i<trs.length;i++){ 33 trs[i].onmouseover=function(event){ 34 e=event?event:window.event; 35 t=e.target||e.srcElement; 36 menu.style.left=getPointerX(e)+"px"; 37 menu.style.top=getPointerY(e)+"px"; 38 menu.style.display="block"; 39 } 40 trs[i].onmouseout=function(event){ 41 e=event?event:window.event; 42 t=e.target||e.srcElement; 43 menu.style.left=getPointerX(e)+"px"; 44 menu.style.top=getPointerY(e)+"px"; 45 menu.style.display="none"; 46 } 47 } 48 function getPointerX(event) { 49 return event.pageX || (event.clientX +(document.documentElement.scrollLeft || document.body.scrollLeft)); 50 } 51 function getPointerY(event) { 52 return event.pageY || (event.clientY +(document.documentElement.scrollTop || document.body.scrollTop)); 53 } 54 </script> 55 </html>
网页效果如图：