Bootstrap Affix 仅适用于没有滑出菜单的页面答案

【问题标题】：Bootstrap Affix only working on pages without the slide out menuBootstrap Affix 仅适用于没有滑出菜单的页面
【发布时间】：2014-10-04 08:41:37
【问题描述】：

** 更新**

所以经过更多调查后，我将其范围缩小到阻止词缀类工作的这段 javascript.. 但又一次.. 我不确定为什么这会破坏页面？？

    var panelExample = $('#someID').scotchPanel({
    containerSelector: 'body', // Make this appear on the entire screen
    direction: 'left', // Make it toggle in from the left
    duration: 300, // Speed in ms how fast you want it to be
    transition: 'ease', // CSS3 transition type: linear, ease, ease-in, ease-out, ease-in-out, cubic-bezier(P1x,P1y,P2x,P2y)
    clickSelector: '.toggle-panel', // Enables toggling when clicking elements of this class
    distanceX: '300px', // Size fo the toggle
    enableEscapeKey: true // Clicking Esc will close the panel
});

我一直试图弄清楚为什么当我有一个滑出菜单时词缀类会中断。我目前正在处理的网站是这样的：site link

如果您看到其他页面，则在您向下滚动后菜单会停留在顶部。但是犯罪页面不起作用。我已将其缩小到导致它不起作用的 HTML 的这一部分，但我似乎无法弄清楚原因。那个 div 标签看起来没有什么特别之处。

<div id="burgerWrapper" class="toggle-panel">
    <h3 id="closeBtn">X</h3>
    <ul>
        <li class="hidden"><a class="page-scroll" href="#page-top"></a></li>
        <a href="#criminalLaw" class="page-scroll"><li>CRIMINAL LAW</li></a>
        <a href="#criminalLocalCourt" class="page-scroll"><li>LOCAL COURT MATTERS</li></a>
        <a href="#criminalMentalHealth" class="page-scroll"><li>SECTION 32 APPLICATIONS</li></a>
        <a href="#criminalConviction" class="page-scroll"><li>CONVICTION AND SEVERITY APPEALS</li></a>
        <a href="#criminalBail" class="page-scroll"><li>BAIL APPLICATIONS</li></a>
        <a href="#criminalSerious" class="page-scroll"><li>SERIOUS CRIME</li></a>
        <a href="#criminalPenalties" class="page-scroll"><li>PENALTIES AND SENTENCES</li></a>
        <a href="#criminalFee" class="page-scroll"><li>FEE ARRANGEMENTS</li></a>
    </ul>
</div>

当我删除这个 div 时，它可以工作。任何帮助或推动正确方向都会很棒！

谢谢

【问题讨论】：

只使用不带滚动间谍的词缀就可以了
克里斯蒂娜 - 什么卷轴间谍？
你身体标签上的那个
这就是我以为你的意思.. 但这似乎没有什么区别。我还认为该标签被用于子菜单的滚动操作..但是没有它滚动似乎仍然有效..还有其他想法吗？
将 containerSelector 更改为页面上的其他 div，而不是 body，看看会发生什么。

标签： html css twitter-bootstrap-3 affix

【解决方案1】：

这可能是它的原因。通过删除它进行测试。

<section id="burgerIcon">
        <button type="button" class="navbar-toggle toggle-panel">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
</section>

【讨论】：

没有仍然不工作..仅当我删除 burgerWrapper div 时才有效...但我不知道为什么。