帮忙修改这个提示为鼠标跟随效果-----在线等

<style type="text/css">
.info {position:relative;background:#fff;color:#666; text-decoration:none;font-size:12px;width:150px;text-align:center;border:1px solid #ccc;height:25px;line-height:25px; float:left; width:150px;z-index:2;}
.info:hover {background:#eee;color:#333;z-index:3;}
.info span {display: none }
.info:hover span {display:block;position:absolute;width:130px;border:1px solid #ff0000; background:#fff; color:#000;padding:5px;text-align:left; z-index:9; margin-top:8px;
</style>
</head>
<body>
<p><table>
<tr>
<td >
<a  class="info" href="#">jhjhhjjhjh<span>显示内容</span></a>
</td>
<td >
<a  class="info" href="#">jhjhhjjhjh<span>显示内容</span></a>
</td>
<td >
<a  class="info" href="#">jhjhhjjhjh<span>显示内容</span></a>
</td>
</tr>
</table>
</p>

解决方案 »

  1.   

    <style type="text/css">
    .info {position:relative;background:#fff;color:#666; text-decoration:none;font-size:12px;width:150px;text-align:center;border:1px solid #ccc;height:25px;line-height:25px; float:left; width:150px;z-index:2;}
    .info:hover {background:#eee;color:#333;z-index:3;}
    .info span {display: none }
    .info:hover span {display:block;position:absolute;width:130px;border:1px solid #ff0000; background:#fff; color:#000;padding:5px;text-align:left; z-index:9; margin-top:8px;}
    </style>
    <script>
    function fun()
    {
    event.srcElement.childNodes[1].style.top = event.y;
    event.srcElement.childNodes[1].style.left = event.x;
    }
    </script>
    </head>
    <body>
    <p><table>
    <tr>
    <td >
    <a  class="info" href="#" onmousemove="fun()">jhjhhjjhjh<span>显示内容</span></a>
    </td>
    <td >
    <a  class="info" href="#" onmousemove="fun()">jhjhhjjhjh<span>显示内容</span></a>
    </td>
    <td >
    <a  class="info" href="#" onmousemove="fun()">jhjhhjjhjh<span>显示内容</span></a>
    </td>
    </tr>
    </table>
    </p>
      

  2.   

    我想改为提示鼠标跟随。
    档上的：event.srcElement.childNodes[1].
    是什么意思？
      

  3.   

    提示错误：
    event.srcElement.childNodes[1].style 为空或不是对象。何解