Question

我需要有一个隐藏的div，并在我点击页面的位置显示它。我的位置是否相对？如何关联点击位置？

Answer 1

使用javascript：http://dev-notes.com/code.php?q=33

获取光标的位置

并使用位置绝对值将其设置为左侧和顶部css位置：）

Answer 2

使用事件的mouseX和mouseY属性。

http://api.jquery.com/event.pageX/
http://api.jquery.com/event.pageY/

然后在单击后设置div的绝对位置。

Answer 3

如果您了解jQuery，那么您可以用一个简单的css({left:e.pageX, top:e.pageY})替换此示例（点击任意位置，您将获得该位置）：

http://jsbin.com/ufovo3

这是代码： http://jsbin.com/ufovo3/edit

$(document).click(function(e){ //Change the "document" to whatever you want
  alert('x: '+e.pageX+', y:'+e.pageY);
});

这是一个更好的演示： http://jsbin.com/ufovo3/2/

源 http://jsbin.com/ufovo3/2/edit

单击它并观察它在您单击的位置移动。

Answer 4

JSFIDDLE DEMO

$(document).click(function(e) {
    var height = $('#popup').height();
    var width = $('#popup').width();
    leftV = e.pageX - (width / 2) + "px";
    topV = e.pageY - (height / 2) + "px";
    $('#popup').css({
        left: leftV,
        top: topV
    }).toggle();
});


.popup{
    position:absolute;
    background:#cf5;
    z-index:10;
    width:100px;
    height:100px;
    text-align:center;
    color:#4e4e4e;
    display:none;
}

隐藏的div显示点击的位置

4 个答案:

JSFIDDLE DEMO