Question

我想确定用户点击的光标位置。

在用户点击的页面底部显示一个div。

例如，如果有人点击徽标，请在stack over flow主页上。

然后div应显示在徽标的底部位置。

如果我点击底部链接，那么该div应该显示在页面的底部。

我使用mootools作为我的JS框架。但任何JavaScript代码对我都有帮助。

希望大家都清楚这一点。

提前致谢
阿维纳什

Answer 1

<head>
</script>        
function mouseX(evt) 
{
    if (evt.pageX) return evt.pageX;
    else if (evt.clientX)
        return evt.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
    else return null;
}
function mouseY(evt) 
{
    if (evt.pageY) return evt.pageY;
    else if (evt.clientY)
        return evt.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop :  document.body.scrollTop);
    else return null;
}
function clicked(evt)
{
    if(typeof evt == 'undefined')
    evt = window.event;
    alert("X = "+ mouseX(evt) + " Y= " + mouseY(evt);

}
</script></head>
<body onclick="clicked()"></body>

你可以简单地使用window.event.x, window.event.y，但这是一个更稳定的＆amp;获得职位的可靠方法..

[而不是警告，您将更改divElement.style.left , divElement.style.top ..请确保div的position（格式）为absolute。 ]

Answer 2

原型非常简单：

document.observe('click', function(e) {
    $('YourDivId').setStyle({
        'left': e.clientX, 
        'top': e.clientY
    }).show();
});

现在你需要做的就是在你的身体上用“display：none”和“position：absolute;”创建一个html DIV。和你想要的内容。

找到用户点击的光标位置，并显示用户点击的一个div

2 个答案: