无论屏幕大小如何，如何跟踪位置？

Question

我正在尝试创建一个使用JavaScript选择页面区域的小部件，但问题是当它保存X/Y和Width/Height时，它实际上只与该屏幕大小相关，因此，如果我们尝试在另一个用户的计算机上绘制该选择，它将会离开正确的位置。

无论用户的屏幕大小是什么，依赖什么以及如何跟踪x和y位置？

Answer 1

obj.offsetLeft和obj.offsetTop将始终相对于上/左角为0,0。

• 中心x = window.innerWidth / 2;
• 中心y = window.innerHeight / 2;
• 对象宽度= elementNode.offsetWidth;
• 对象高度= elementNode.offsetHeight;

将对象放在屏幕中间：

el = document.getElementById('my_div');
el.style.position = 'absolute';
el.style.left = Math.floor((window.innerWidth / 2) - (el.offsetWidth / 2)) + 'px';
el.style.top  = Math.floor((window.innerHeight / 2) - (el.offsetHeight / 2)) + 'px';

工作演示：http://jsfiddle.net/4aenr/