html - 创建一个像 facebook 一样的 div 聊天

Question

在简短的例子中，我正在尝试做一个 div 聊天示例来模拟 Facebook 聊天。

我将它固定在右侧，z-index 300 始终显示。

我的问题是关于高度的，因为有些页面我有滚动和大高度视图，而我的聊天 div 固定在相同的原始页面高度上，如果我向上滚动或向下滚动，我会限制我的 div 的高度。

我想知道它是否足够固定，即使我向上或向下滚动页面，也能以相同的原始方式在页面上保持可见。

我的示例 CSS 是：

#chat {
  position: absolute;
  top: 0;
  right: 0;
  float: right;
  height: 100%;
  min-height: 100%;
  width: 200px;
  background-color: #6e9bfe;
  z-index: 300;
}

任何提示都会非常有帮助，谢谢！

Answer 1

如果我的想法是正确的，您希望此 div 保持在您向上和向下滚动要使用的页面position:fixed;而不是position:absolute;在 CSS 中的相同位置。

Answer 2

使用position:fixed;代替position:absolute;