鼠标点击在鼠标位置弹出层，层的位置怎么计算？ - JavaScript论坛

gupiao175

等　级：版主
威　望：40
帖　子：1787
专家分：7527
注　册：2007-6-27

第 2 楼

得分:20

<html>
<head>
<meta http-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>javascript取得鼠标地位</title>
<style type="text/css">
#block{position:absolute;font-size:9pt;background-color:#FFFFCC;padding:5px;border:1pxsolid#F5C66B;line-height:160%;width:300px;display:none;}
</style>
</head>
<body>
鼠标X轴:
<input id=xxx type=text>
鼠标Y轴:
<input id=yyy type=text>
<div id="block">3333</div>
<script>
function mouseMove(ev)
{
ev=ev||window.event;
var mousePos=mouseCoords(ev);
document.getElementById("xxx").value=mousePos.x;
document.getElementById("yyy").value=mousePos.y;
}
function mouseCoords(ev)
{
if(ev.pageX||ev.pageY)
{return{x:ev.pageX,y:ev.pageY};}
else{
return{
x:ev.clientX+document.body.scrollLeft-document.body.clientLeft,
y:ev.clientY+document.body.scrollTop-document.body.clientTop
};
}
}
var flag=false;
var di=document.getElementById("block")
function divv(ev)
{
ev=ev||window.event;
var mousePos=mouseCoords(ev);
if(!flag)
   {
    flag=true;
   di.style.left=mousePos.x;
  di.style.top=mousePos.y;
  di.style.display="block";}
   else
   {
   flag=false;
   di.style.display="none";}
}
document.onmousemove=mouseMove;
document.onmousedown=divv;
</script>
</body>
不知道是不是类似这样的，用了最原始的JS方法，代码比较多了些！只测试了IE，还没有测试其他浏览器！