JS 获取鼠标坐标

最新推荐文章于 2024-09-01 09:40:14 发布

weixin_30819163

最新推荐文章于 2024-09-01 09:40:14 发布

阅读量138

点赞数

原文链接：http://www.cnblogs.com/wugang/archive/2012/06/19/2555096.html

版权

event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft) - document.body.clientLeft + "px";

event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) - document.body.clientTop + "px";

View Code

function showDiv(i) {
    divSeat(i);
    
    document.getElementById('forumlist_menudiv'+i).style.display = "block"; //显示div
}
function hideDiv(i) {
    divSeat(i);
    document.getElementById('forumlist_menudiv'+i).style.display = "none"; //隐藏div
}

function divSeat(i) {
    var pos = getElementPos(document.getElementById("showmydiv"));
//    document.getElementById("forumlist_menudiv"+i).style.left = pos[0] + 35 + "px";
    //    document.getElementById("forumlist_menudiv"+i).style.top = pos[1] + 23 + "px";

    document.getElementById("forumlist_menudiv" + i).style.left = event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft) - document.body.clientLeft + "px";
    document.getElementById("forumlist_menudiv" + i).style.top = event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) - document.body.clientTop + "px";
}
function getElementPos(obj) {
    var left = 0;
    var top = 0;

    if (obj.x) {
        left = obj.x;
        top = obj.y;
    } else if (obj.offsetParent) {
        while (obj.offsetParent) {
            left += obj.offsetLeft;
            top += obj.offsetTop;
            obj = obj.offsetParent;
        }
    }

    return [left, top]; //作为一个数组返回
}


/*
<style>
.popupmenu_div{border:solid 1px #CCC; position:absolute; left:0; top:0; z-index:3000}
.popupmenu_div dl{ padding:0px 0 0 0px; clear:both;}
.popupmenu_div dl dt{ color:#666; padding-left:5px;}
.popupmenu_div dl dd{ padding-left:25px;}
.popupmenu_div dl dt a{ color:#666;}
.popupmenu_div dl dt a:hover{ color:#666; text-decoration:underline;}
.popupmenu_div dl dd a{ color:#0058A6;}
.popupmenu_div dl dd a:hover{ color:#0058A6; text-decoration:underline;}
</style>


<div style="margin-left:600px" id="showmydiv"><div  οnmοuseοut="hideDiv()" οnmοuseοver="showDiv()">More</div></div>
<div class="popupmenu_div" id="forumlist_menudiv" οnmοuseοver="showDiv();" οnmοuseοut="hideDiv()" style="display:none">
<dl>
<p >要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；要显示和隐藏的内容；</p>
  </dl>
</div>
*/