Question

所以我有一个页面布局，其主要内容容器div是位置相对的。在这个容器中，我有两个其他布局div，一个用作侧边栏，另一个用作可以向上和向下滚动的内容容器。此div还有一个标题栏，当您滚动此div时，该标题栏必须保留在原位。如果我将标题栏固定在标题栏上，只要您在该容器中滚动，它就会保持原位。如果你滚动整个窗口（在包装div之外），标题栏会随之滚动。我知道为什么会这样，但想知道是否有办法解决它或防止这种行为。我也不介意使用Javascript这样做。我知道固定定位只会使元素固定在其父容器上。

这很可能很难理解，至少可以通过文本进行明智的解释，所以这里有一个非常简单的例子，只是一些标记显示哪些项目是固定的以及它们是如何布局的。 http://jsfiddle.net/gvNqv/

非常感谢大家提供任何可能的帮助！

编辑：在这里添加来自小提琴的代码

.maincontent{ 
    position:relative; 
    width:760px;
}
.sidebar{
    float:left;
}
.stage{
    float:right;
    position:relative;
}
.headbar{
    position:fixed;
}

<div class="wrapper">
   <div class="mainContent">

      <div class="sideBar"></div>

      <div class="stage">
         <div class="headbar">banner text</div>        
      </div>

   </div>
</div>

enter code here

Answer 1

您是否需要使用顶部，左侧，底部或右侧来固定它？

固定位置窗口滚动问题

1 个答案: