2

私は次のHTMLを持っています

<header class="fixed">...</header>
<div id="content">
    <div id="sidemenu" class="fixed">...</div>
    <div id="scroll">...</div>
</div>
<footer class="fixed">...</footer>

CSSとルールでのさまざまな配置ルール

.fixed {
    position: fixed;
}

これにより、id スクロール移動を持つ div のみの目的の効果が得られます。ただし、これによりフッターが見えなくなる可能性があります。

私がやりたいことは、スクロール div の下部がフッターの下部に到達したら、に変更position: fixedするposition: absoluteと、すべてが一緒にスクロールしてフッターが表示されることです。

しかし、私はそれを行う方法がわかりません。ウェイポイントを見ていましたが、少し頭を悩ませています。

4

2 に答える 2

1

このようなものがあなたの問題を解決するはずです。これを試して：

$(window).scroll(function () {
    var scrollBottom = $(document).height() - $(window).height() - $(window).scrollTop();

    if (scrollBottom <= $("footer").height()) {
        $("footer").css("position", "absolute");
        } 
        else {
            $("footer").css("position", "fixed");
        }
});
于 2013-09-19T12:37:11.730 に答える
0

そのために、「onScroll」イベントがあります。そして、スクロール div の座標がフッターの座標と一致するかどうかを確認します。それらが一致するとすぐに、ハンドラーの実装で位置を「絶対」に変更します。

于 2013-09-19T11:51:57.360 に答える