87,990
社区成员
发帖
与我相关
我的任务
分享<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>New Document </title>
</head>
<body>
<div>
<ul id="ul">
<a index="link1">111111</a> <a index="link2">222222</a> <a index="link3">333333</a>
</ul>
<ul id="links" style="display:none">
<li id="link1"><a href="http://www.sina.com">sina</a> </li>
<li id="link2"><a href="http://www.qq.com">tencent</a> </li>
<li id="link3"><a href="http://www.sohu.com">sohu</a> </li>
</ul>
</div>
<style type="text/css">
.tip
{
position: absolute;
height: 100px;
width: 100px;
border: 1px solid #000;
}
</style>
<script type="text/javascript">
var list = document.getElementsByTagName("a");
var tip ;
var old;
for(var i = 0 ; i < list.length; i ++)
{
list[i].onmouseover = function(e)
{
if(old) old.parentNode.removeChild(old)
e = e || window.event;
var x = this.offsetLeft+10
var y = this.offsetTop+20
old= tip = document.createElement("div");
tip.className = "tip"
tip.style.left = x+"px";
tip.style.top = y+"px";
var id = this.getAttribute("index");
var html = document.getElementById(id).innerHTML;
tip.innerHTML = html
document.body.appendChild(tip);
return false;
}
}
</script>
</body>
</html>