ページ フッターでの固定オブジェクトの修正

フッター上をスクロールする固定オブジェクトの一般的な問題には、簡単な解決策があります。たとえば、画面の左下隅にある固定の「共有」ボックスを考えてみましょう。フッターと重ならないように、フッターの約 10 ピクセル上で停止します。

まず、ページがスクロールされるたびに、ボックスがフッターにどれだけ近いかを判断する必要があります。

$(document).scroll(function() {
    checkOffset();
});

ボックスがフッターに近づきすぎる場合（つまり、10 ピクセル以内）、その位置を絶対位置に変更します:

function checkOffset() {
    if($('#social-float').offset().top   $('#social-float').height() 
                                           >= $('#footer').offset().top - 10)
        $('#social-float').css('position', 'absolute');
    if($(document).scrollTop()   window.innerHeight 
#social-float の親は、HTML 構造内のフッターの兄弟である必要があることに注意してください。