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

Question

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

Answer 1

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/