貼り付けられたサイドバーの位置が変更されない

Question

Bootstra Affixプラグインを使用する際に問題が発生します。私はサイドメニューを貼り付けてもらいたいが、ヘッダの下とドキュメントのフッタの上に常に置い​​ておきたいので、メニューを両方から離しておくためにdata-offset-topとdata-offset-bottom HTML5のデータ属性を使用した。

これは、ページを一番下にスクロールするまではすべて正常に動作します。その時点で、メニューは上に戻り、もう貼られません。ページを下にスクロールすると、メニューはフッターの上に残ります（これは正しい）。しかし、バックアップをスクロールすると、トップにジャンプしてそこにとどまります。

ここにはCodePenがあります。どのようにこれを解決することができますか？

---

編集：いくつかのデバッグ後

、私はこの問題は、affix-bottom到達するとposition:relativeスタイルが適用されることに関連しているように見えることに気付きました。バックアップをスクロールすると、スタイルはこれにリセットされ、位置は変わりません。

Bootstrapスクリプトには何らかの機能やバグはありますか？

Answer 1

私は私の質問に記載された動作が「意図された機能」かバグかどうかまだ分かりません。しかし、私は次のような問題を解決することができました。

私の質問の編集に記載されているように、問題は、状態に適用され、affix状態に切り替えるときには削除されません。そこで、affix状態に切り替えるときに、すべてのインラインスタイルを完全に削除するイベントハンドラを追加しました。単にCodePenで使用JSに次のコードを追加します。もちろん

$('.right_box').on('affixed.bs.affix', function() { 
    $this = $(this); 
    $this.removeAttr('style'); 
}); 

を他のインラインスタイルが使用されていない場合、この回避策がのみ適用されるべきです。

この解決法は、同じ問題にどのように遭遇するのか他の誰かを助けるかもしれません。 実際のの問題が解決したら、私はそれを知ってうれしく思っています:)