Bootstrap词缀将元素移动到容器的左侧

Question

我想要贴上两个侧边导航栏，但是当我向下滚动时，我的左侧导航栏移动到其父div的左侧。

我知道问题是，词缀会将位置更改为固定，因此任何浮点数都无关紧要。

我的问题应该在这个

中明确

http://www.bootply.com/deaSbNAJ0b - 不介意右侧栏

我相信答案在于javascript。我的第一个想法是改变词缀功能，以便在触发后使用父元素的位置来计算附加元素的位置，但我不知道从哪里开始，javascript对我来说还是新的。

Answer 1

基本上这个问题有already been answered here。正如文档中所解释的那样..

  

通过数据属性使用affix插件或使用您自己的手动插件   JavaScript的。在这两种情况下，你必须提供CSS   贴图内容的定位和宽度。

因此，在这种情况下，您必须为附加元素设置特定宽度。当它变为position:fixed时，它将从正常文档流中删除，并且不会保持基于正常百分比的“未固定”宽度。

您需要调整最适合其他页面内容的宽度，请记住position:fixed无法响应Bootstrap列。这里仅适用于大于991px的宽度，以便列可以在较小的屏幕上正常堆叠。

@media (min-width: 992px) {
  .affix-top {
    position: static;
    margin-top:10px;
    width:240px;
  }

  .affix {
    position: fixed;
    top: 10px;
    width:240px;
  }
}

http://www.bootply.com/FlGXADz2L3