<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<ul>
<li>12345678</li>
<li>234567</li>
<li>1234567</li>
<li>456789</li>
<li>1234567</li>
</ul>
<div id="mm" style=" position:fixed; margin-top:-100px; margin-left:30px;">
<div style=" border-bottom:1px solid #999;border-left:1px solid #999; margin-left:100px; background-color:#FFF; margin-top:20px; overflow:hidden; width:15px; height:15px;transform:rotate(45deg)"></div>
<div style="width:200px; height:200px; border:1px solid #999; margin-left:108px; border-radius:10px; margin-top:-45px;"></div></div>
</body>
<script>
var bb=document.getElementsByTagName("li").length;
var aa=document.getElementsByTagName("li");
for(var i=0;i<bb;i++)
{
aa[i].onmousemove=function(){
document.onmousemove=function(e)
{
e=e? e:window.event;
var p=e.screenX;
var n=p+"px";
var t=e.screenY;
var to=t+"px"
document.getElementById("mm").style.display= "block";
// document.getElementById("mm").style.left= n;
document.getElementById("mm").style.top= to;
// document.writeln("X:"+e.screenX+"Y:"+e.screenY);
}
}
aa[i].onmouseout=function(){
document.onmousemove=function(e)
{
e=e? e:window.event;
var p=e.screenX;
var n=p+"px";
var t=e.screenY;
var to=t+"px"
document.getElementById("mm").style.display= "none";
// document.writeln("X:"+e.screenX+"Y:"+e.screenY);
}
}
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<li>12345678</li>
<li>234567</li>
<li>1234567</li>
<li>456789</li>
<li>1234567</li>
<div id="mm" style=" position:fixed; margin-top:-100px; margin-left:30px;">
<div style=" border-bottom:1px solid #000;border-left:1px solid #000; margin-left:100px; background-color:#FFF; overflow:hidden; width:20px; height:20px;transform:rotate(45deg)"></div>
<div style="width:100px; height:100px; border:1px solid #999; margin-left:110px; margin-top:-30px;"></div></div>
</body>
<script>
var bb=document.getElementsByTagName("li").length;
var aa=document.getElementsByTagName("li");
for(var i=0;i<bb;i++)
{
aa[i].onmousemove=function(){
document.onmousemove=function(e)
{
e=e? e:window.event;
var p=e.screenX;
var n=p+"px";
var t=e.screenY;
var to=t+"px"
document.getElementById("mm").style.display= "block";
// document.getElementById("mm").style.left= n;
document.getElementById("mm").style.top= to;
// document.writeln("X:"+e.screenX+"Y:"+e.screenY);
}
}
aa[i].onmouseout=function(){
document.onmousemove=function(e)
{
e=e? e:window.event;
var p=e.screenX;
var n=p+"px";
var t=e.screenY;
var to=t+"px"
document.getElementById("mm").style.display= "none";
// document.writeln("X:"+e.screenX+"Y:"+e.screenY);
}
}
}
</script>
</html>
