1

ブートストラップ scrollspy を統合する WordPress サイトがあります。スクロールすると Scrollspy がアクティブになりますが、navbar で最初の 2 つの項目が正しく強調表示されません。最初のコンテンツ ボックスが他のボックスよりも大きいためにオフセットの問題があるようですが、 body タグと を介してオフセットを追加しましたjQuery('.navbar').scrollspy()。padding-top: 100pxページの最初のコンテンツ ボックスにも追加しました。これらの解決策はどれも機能しません。ここで何が欠けていますか？

作業ページ

4

1 に答える 1

7

デフォルトでScrollSpyは data 属性を持つ要素data-spy="scroll"(この場合はbody要素) にバインドされますが、画像やコンテンツが多いため、ready is イベントが発火した後に読み込まれます。

以下のコードに示すように、スクロールスパイのJavaScript APIを使用して、refresh メソッドを使用して計算されたオフセットとターゲットを更新することをお勧めします。

<script type="text/javascript">
jQuery(document).ready(function() {
    setTimeout(updateScrollSpy, 1000);
});
function updateScrollSpy() {
    jQuery('[data-spy="scroll"]').each(function () {
      var $spy = jQuery(this).scrollspy('refresh')
    });
}
</script>

また、「Key Advantage」では内部 ID リンクが提供されていないため、指定されたリンクにリダイレクトされます。

于 2014-02-10T09:50:38.857 に答える