offsetX,offsetY和pageX,pageY有什么区别?

时间:2011-07-11 05:04:34

标签: javascript

我需要一个弹出式div,它会出现在我点击的锚点的正下方。现在,我想确定一个锚点的onClick事件的x和y坐标。这样做的最佳做法是什么?有哪些可取的事件属性可供使用?

2 个答案:

答案 0 :(得分:34)

offsetX offsetY 是相对于父容器的,而 pageX pageY 是相对于文档的。不要将此与.offset().position()混淆,其中.offset()相对于文档而.position()相对于父容器的.offset()

像这个例子应该有用(JQuery):

$('a').click(function(){
    var offset = $(this).offset();
    $('#popup_div').css('top',offset.top + 'px').css('left',offset.left + 'px').show();
});

http://api.jquery.com/offset/

http://api.jquery.com/position/

答案 1 :(得分:2)

来自Jquery文档网站的2个摘录

  

.position()方法允许我们检索元素相对于偏移父元素的当前位置

http://api.jquery.com/position/


  

.offset()方法允许我们检索元素相对于文档的当前位置。

http://api.jquery.com/offset/