スクロール位置を取得

スクロール位置を取得して80％以上スクロールしたら背景色を変えるプログラム。

サンプルデータ

$(function() {
  $(window).scroll(function() {
    //全体の高さを取得
    var documentHeight  = $(document).height();
    //画面の高さを取得
    var windowHeight    = $(window).height();
    //スクロール上部位置を取得
    var windowScrollTop = $(window).scrollTop();
    //スクロール下部位置を取得
    var scrollPosition  = windowHeight + windowScrollTop;
    //スクロール位置（％）
    var scrollParcent  = scrollPosition/documentHeight*100;

    //スクロール位置80%で背景色変更
    if(scrollParcent > 80){
      $('body').css({'background-color':'#FCC'});
    }else{
      $('body').css({'background-color':'#FFF'});
    }
  });
});

Twitterみたいにページ下部にきたら次の項目をロードしたり、記事終わりに他のおすすめ記事をひょこっと表示したりできそう。