javascript - 你能得到一个元素在屏幕上（不是在视口中）的绝对位置吗？

Question

我想将一个元素放在屏幕上的绝对位置上，以便它保持在（大致）相同的位置，即使浏览器窗口移动（不滚动）也是如此。这样的事情甚至可能吗？

Answer 1

也许不是最优化的解决方案，但您可以使用间隔来检查window.screenXand window.screenY（如评论中所建议）。然后，当这些值发生变化时，使用与上一个位置的差异来更新位置。就像是：

function setPosition(el, x, y) {
    var style = window.getComputedStyle(el);
    el.style.left = parseInt(style.left) + x + "px";
    el.style.top = parseInt(style.top) + y + "px";
}

var sX = window.screenX,
    sY = window.screenY,
    box = document.getElementById("box");

var interval = setInterval(function() {
    if (window.screenX !== sX || window.screenY !== sY) {
        setPosition(box, sX - window.screenX, sY - window.screenY);
        sX = window.screenX;
        sY = window.screenY;
    }
}, 1000/30);

这是JSFiddle的示例。在 Chrome 上有点不稳定。