如何让div浮动并随页面中心滚动？

Question

因此，我致力于开发 Facebook FBML 应用程序。我想要的很简单。只需在页面中央显示一个 div，然后随页面滚动即可。即始终位于中心。

用普通的 JS 就很容易了。我只是使用 pageYOffset

但是，在使用 FBJS 的 Facebook 中，我不确定应该使用什么。它没有 getPageYOffset().. 我尝试了 getScrollTop().. 这似乎不是正确的事情。

那么，有人知道怎么做吗？

Answer 1

你以前在 FB 上见过类似的事情吗？在我看来，FBJS 因缺乏 API 选项而给您带来了问题。

在普通 JS 中实现这一点的一种方法是获取滑块的位置（右侧和底部）以及整个屏幕尺寸，然后根据全帧尺寸和滑块偏移确定可视窗口的中心在哪里。

所有这些变量都应该被定义或者可以通过 javascript 检索，以便您抓取和操作，然后只需更新 div 上的 css 值即可将窗口移动到正确的位置。然后，您可以轮询窗口滑块的状态或监视其事件并在更新时检索其位置以重新计算窗口的中心。

如果 FBJS 无法确定窗口大小或滑块位置，那么您将遇到更困难的问题。

Answer 2

使用 css

#myDiv {
    /* Keep position fixed (scroll invariant) */
    position: fixed;

    /* Center */
    left: 50%;
    top: 50%;

    /* Set width and margin to account for half of width */
    width: 200px;
    margin-left: -100px;

    /* Set height and margin to account for half of height */
    height: 100px;
    margin-top: -50px;
}

前 3 行将使页面左上角居中。
接下来的 4 行设置宽度，然后向后和向上移动 div 以使中心居中。

来自 w3Schools 的有关职位的更多信息。

Answer 3

使用 Facebook 的调用 myDiv.getAbsoluteTop() 怎么样？这不会使对象保持固定，但它至少会从正确的位置开始。

还有另一个想法——你可以生成一张图像，并将该图像设置为背景，我认为你可以保持固定。但这取决于你到底想要什么。