如何在模态中使用Bootstrap的Affix.js和Scrollspy？

Question

我目前正在尝试修复一组内容左侧的导航。为了给你一个想法，我在'row'和'container'对div中处理col-md-3和col-md-6。简单地说：有两列，最小的列包含导航链接列表（nav nav-pills nav-stacked导航）。

问题是在点击并滚动到各自的部分后，Scrollspy不会突出显示链接。并且，Affix不会将导航栏固定在相邻列的一侧。

示例代码：

的index.html

    <div class="container">
        <div class="row">

            <!-- My Naviagtion -->
            <div class="col-md-3" data-spy="scroll" data-offset="0" data-target=".fun" role="complementary">
                <div class="fun">
                    <ul class="nav nav-pills" role="tablist">
                        <li><h2>Navigation</h2></li>
                        <li><a href="#sectionone">Section1</li>
                        <li><a href="#sectiontwo">Section2</li>
                    </ul>
                </div>
            </div> 


            <div class="col-md-6" role="main">
              <div id="#sectionone">...</div>
              <div id="#sectiontwo">...</div>
            </div>
       </div> <!-- end row -->
   </div> <!-- end container -->

myapp.js

$(document).ready(function() {
    $('.col-md-3').scrollspy({ target: '.fun' });
}

的style.css

.col-md-3 {
    position: relative;
} /* At this point, I was trying anything. */

可能有帮助：模式中有标签，这些部分（包括固定导航）应该位于一个标签中。