Question

我正在建立一个＆lt; div>每当网站所有者决定与其中一位访问者开始对话时弹出的框（聊天框）。现在的样子，访问者可能在聊天框弹出之前滚动了几页，然后隐藏了聊天框！如何才能使聊天框始终弹出页面的可见区域？

我使用jQuery轮询服务器，并在需要时加载该框。

#chatBox {
  z-index: 100;
  position: absolute;
  top: 100;
  left: 200;
  width: 400;
  height: 200;
  background-color: #8596C1;
  padding: 15px;
  border: solid 2px;
  border-color: #BDDEFF #14285F #14285F;
  display: none;
}

感谢您的帮助：）

Answer 1

.chat_container { position: fixed; top: 100px; }

Answer 2

可以通过应用position: fixed样式来完成 Doesn't work in IE6 though，如果你足够关心，你需要一个Javascript后备。

Answer 3

您可能需要在每个可能的页面上为此工作添加一个属性。

与position:fixed和top:100px一起，你需要添加z-index:99999，这将有助于聊天框保持在页面顶部，即使有一些元素已经设置了z-inex属性

我如何保持＆lt; div>页面顶部100个像素，无论页面滚动到哪里？

3 个答案: