Question

我尝试在我的一个mvc4项目中使用bootstrap affix（2.1.0）。如果在滚动50px后，.span9内容向左移动，似乎.span3和.span9无法正常工作。

我发现了这个：Text moves to side of the page on scroll down但是没有用。向spans添加浮动工作不知何故，但不是“响应”。我认为它必须是一个更好的解决方案。

有人能让它发挥作用吗？

这是我的代码（从bootstrap网站复制和粘贴）。我做错了什么？

<body data-spy="scroll" data-target=".bs-docs-sidebar">
<div class="container">
....
<div class="row">
  <div class="span3 bs-docs-sidebar" data-spy="affix" data-offset-top="50">
    <ul class="nav nav-list bs-docs-sidenav">
      <li><a href="#download-bootstrap"><i class="icon-chevron-right"></i> Download</a></li>
      ....
      <li><a href="#what-next"><i class="icon-chevron-right"></i> What next?</a></li>
    </ul>
  </div>
  <div class="span9">
    ....
    <section id="download-bootstrap">

Answer 1

问题解决了。一旦我贴上无序列表，一切正常。不知何故，我明白我必须加贴父div，而不是列表本身。我的错误。

Answer 2

解决此问题的另一种方法是设置导航范围min-height

.span3 {  
    min-height: 1px;  
}

我也需要在平板电脑模式下将导航设置为不加贴：

@media (max-width: 767px) {
    .sidenav.affix {
        position: static;

目前，文档中还没有足够的内容解释如何使其发挥作用。

Twitter-Bootstrap 2.1.0附加插件 - 无法正常工作

2 个答案: