Javascript 固定背景，不考虑浏览器位置（包括说明图片！）

如果可能的话，我更愿意在HTML/CSS/JS中这样做，但如果没有，一切都会发生

我试图设置一个网页的背景，使其具有一种绝对位置，无论浏览器窗口在屏幕上的什么位置，也不管大小，它都会保持在那里

澄清图片：

---

（图片说明：红色轮廓是浏览器窗口，浅蓝色透明图片是图片应该始终具有的位置和大小）

您可以使用

window.screenX

和

window.screenY

获取窗口的屏幕位置。然后，您可以使用一个简单的间隔计时器来跟踪：

setInterval(function() {
  $('body').css('backgroundPosition',
              -window.screenX + 'px ' + -window.screenY + 'px');
}, 50);

（这使用jQuery，但不是必需的。）

这有点紧张，但它可能会加热客户端机器，这样我就不会运行太快的计时器。问题是，虽然浏览器会告诉您有关窗口大小的更改（“调整大小”事件），但它不会通过事件告诉您有关窗口移动的信息

这是一个没有jQuery的更高效的版本，并进行了一些检查，以避免在窗口未移动时接触样式。即使每15毫秒运行一次：

(function() {
  var sx = window.screenX, sy = window.screenY;

  setInterval(function() {
    if (window.screenX !== sx || window.screenY !== sy)
      document.body.style.backgroundPosition = 
         -(sx = window.screenX) + 'px ' + -(sy = window.screenY) + 'px';
  }, 15);
})()

---

我想你不能？你可以得到屏幕大小和窗口大小，但我不认为你可以得到浏览器窗口相对于屏幕的偏移量，因此没有办法知道浏览器在哪里？@adeneo我认为大多数浏览器都会给你

窗口。screenX

和

screenY

@Pointy-这很酷，我知道这些，但从未发现它们有任何用处，我想就是这样了？@Prongs@user3163104 Linux上的Firefox似乎在报告整个浏览器窗口左上角的屏幕位置。Firefox还支持“mozInnerScreenX”和“mozInnerScreenY”属性，这些属性的工作方式与您想要的一样-我不知道其他浏览器的情况。@user3163104是的，请参见：）可能存在类似Mozilla的IE属性，但是我现在不能尝试IE。@user3163104有一件很奇怪的事，Firefox和Chrome显示的图像颜色与我实际桌面背景上的图像颜色明显不同。虽然没有太大的不同，但是很明显。所以为了防止以后有人偶然发现这个问题，只需添加一个特定的像素偏移量，而不必费心改变背景位置，问题就解决了。通过将以前的代码更改为：-（sx=window[xp]-2560）+“px”+-（sy=window[yp]+278）+“px”来添加偏移量；