jQuery偏移顶部无法正常工作
我正在尝试创建一个脚本通过鼠标在元素中绘制一些东西，而我正在使用Raphaeljs来做到这一点。
为了正确绘制，我需要找到input元素的top和left 。 我正在使用var offset = $("#input").offset(); left 。
但top值不正确。 它比真正的top距离低10px 。 我认为10px可能会在不同的分辨率下改变，然后我通常不能添加10px然后我想知道如何解决问题！
我在这里上传了我的考试。
jQuery .offset()函数有这个限制 ：
注意：jQuery不支持获取隐藏元素的偏移坐标或者考虑body元素上的边框，边距或填充集。
在这种情况下，机身有一个10px的顶部边框，这就是为什么你的绘图偏离10像素。
推荐解决方案
var offset = $("#input").offset(); x = x - offset.left - $(document.body).css( "border-left" ); y = y - offset.top + $(document.body).css( "border-top" );
我有两种不同的解决方案：
1）您可以使用outerHeight（true）方法计算上面元素的总高度。 此方法将使用边距，填充和边框计算高度。
这不会产生冲突 ，它将回归真正的价值。 这是jsFiddle的例子。
HTML
jQuery的
var myEleTop = $('.header').outerHeight(true) + $('.nav').outerHeight(true);
2）如果你为相对于主体提出的元素定义了top css，你也可以使用这个值：
parseInt($('#myEle').css('top'));
经过一段时间的斗争并回顾各种可能的答案后，我得出结论，jQuery offset（）。top （以及它所使用的DOM API）对于一般用途来说太不可靠了。 它不仅被记录为排除html级别边距，而且还在其他几种情况下返回意外结果。
position（）。top确实有效，但设计页面可能不太实际/可行，因此它是等效的。
幸运的是，我发现element.getBoundingClientRect（）。top可以完美地获取相对于视口的位置。 然后，您可以添加$（document）.scrollTop（）以根据需要从文档顶部获取位置。