Bootstrap词缀的unaffix事件?

red*_*war 14 jquery events twitter-bootstrap twitter-bootstrap-3 jquery-events

我想将affix插件与bootstrap navbar-fixed-top类结合起来.到目前为止,我已经使它工作,然后当我滚动浏览导航栏时,它得到修复.但当我向上滚动时,我希望它再次回到静态.我从较旧的bootstrap版本和unaffix事件中看到了一些代码.为什么会消失?我可以创建一个吗?或者如何完成我在这里尝试的东西?

navbar_secondary = $( '.navbar-secondary:first' );

navbar_secondary.affix( {
    offset: {
        top: function () {
            return (this.top = navbar_secondary.offset().top )
        }
    }
} );

navbar_secondary.on( 'affix.bs.affix', function () { // this is actually the wrong event for this. I want this to fire when its *not* affixed
    console.log('affix');
    navbar_secondary.removeClass( 'navbar-fixed-top' ).addClass( 'navbar-not-fixed' );
} );

navbar_secondary.on( 'affixed.bs.affix', function () {
    console.log('affixed');
    navbar_secondary.removeClass( 'navbar-not-fixed' ).addClass( 'navbar-fixed-top' );
} );
Run Code Online (Sandbox Code Playgroud)

red*_*war 42

自己搞清楚了.这个事件名称完全令人困惑.affixed-top.bs.affix实际上是它回到没有贴上的事件.

navbar_secondary = $( '.navbar-secondary:first' );

navbar_secondary.affix( {
    offset: {
        top: function () {
            return (this.top = navbar_secondary.offset().top )
        }
    }
} );

navbar_secondary.on( 'affixed-top.bs.affix', function () {
    console.log('unaff');
    navbar_secondary.removeClass( 'navbar-fixed-top' ).addClass( 'navbar-not-fixed' );
} );

navbar_secondary.on( 'affix.bs.affix', function () {
    console.log('aff');
    navbar_secondary.removeClass( 'navbar-not-fixed' ).addClass( 'navbar-fixed-top' );
} );
Run Code Online (Sandbox Code Playgroud)

摘要

affix.bs.affix =>之前固定定位被施加到一个元件
affixed.bs.affix固定定位被施加到元件后=>
贴上-top.bs.affix顶部元件返回到其原始之前=>(非固定的)位置
固定-top.bs.affix =>顶部元件返回到它的原始(非固定的)位置之后
词缀-bottom.bs.affix =>前一底部元件返回到它的原始(非固定的)位置
固定-bottom.bs.affix =>底部元素返回其原始(非固定)位置后