evento unffix per l'affisso Bootstrap? - jquery, twitter-bootstrap, eventi, eventi javascript, twitter-bootstrap-3

Voglio combinare il plugin affisso con ilbootstrap navbar-fixed-top class. Finora ho funzionato, quindi quando scorro oltre la barra di navigazione viene risolto. Ma quando torno indietro, voglio che torni di nuovo allo stato statico. Ho visto del codice che penso da versioni bootstrap precedenti e a unaffix evento. Perché è andato? Posso crearne uno? O come realizzare quello che sto provando qui?

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" );
} );

risposte:

L'ho capito da solo. I nomi di questo evento sono totalmente confusi. affixed-top.bs.affix è in realtà l'evento quando torna a non essere apposto.

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" );
} );

Sommario

affisso.bs.affisso => prima che il posizionamento fisso venga applicato a un elemento
apposto.bs.affisso => dopo che il posizionamento fisso è stato applicato a un elemento
affix-top.bs.affix => prima che un elemento in alto ritorni alla sua posizione originale (non fissa)
affisso-top.bs.affix => dopo che un elemento in alto ritorna nella sua posizione originale (non fissa)
affix-bottom.bs.affix => prima che un elemento in basso ritorni alla sua posizione originale (non fissa)
apposto-fondo.bs.affix => dopo che un elemento in basso ritorna nella sua posizione originale (non fissa)

Ahnbizcad, ho scoperto che l'offset inferiorenon funziona così. Se hai bisogno di gestire l'evento unaffix come stava chiedendo redanimalwar, suggerisco di impostare il posizionamento CSS per ogni fase in modo esplicito. Ad esempio:

    ul.affix {
position: fixed;
top: 100px;
}
ul.affix-top {
position: static;
}
ul.affix-bottom {
position: absolute;
}

E poi puoi definire il valore della funzione offset-bottom in questo modo:

    <ul class="list-group navbar_secondary" id="affix-nav" data-spy="affix" data-offset-top="500" data-offset-bottom="-4620">

Quindi, la funzione inizierà a 500 px e si fermerà nel punto desiderato dello scorrimento.