Javascript 将body/div的背景位置居中于视口的中间

我的身体高度是1000px，屏幕高度是100px。我想显示一个占据整个

宽度和

高度的

。该

有一个

背景图像

，我想让它显示在视口的中间。如何使用Javascript实现这一点

我使用了以下概念，但在移动设备中不适用

  ele.style.backgroundPosition = document.body.scrollTop + 
                                 (window.innerHeight / 2) - heightOfImage;

---

最简单的解决方案可能是设置一个固定位置的

，并在其上设置背景图像，其z索引集使其显示在页面上的所有其他元素下

例如：

如果你真的想走JavaScript路线（如果我能帮上忙，我个人不会这么做），你必须按照以下思路做：

连接到正在滚动的元素的滚动事件

每次触发时，调整滚动位置，如下所示：

var verticalPosition=document.body.scrollTop+（window.innerHeight/2）-图像的高度

ele.style.backgroundPosition='center'+verticalPosition+'px'

注意添加了
'px'
，因为这很重要。“center”后面还有一个空格，因此您应该以如下形式结束：
ele.style.backgroundPosition='center 50px'

示例（使用Zepto或jQuery）：
您特别针对哪些移动设备？@vee所有支持HTML5和CSS3的设备背景位置CSS属性可以包含两个参数，如：“背景位置：[水平][垂直]”。如果只指定一个参数（如示例中所示），它将只设置水平滚动位置（将垂直位置保留在50%）。您是否只是试图垂直地对准图像，或者实际上希望它始终显示在视口的中间，即使用户向下滚动页面吗？是的，我希望它即使在滚动的情况下也在视图的中间。