スクロールに合わせて背景画像の位置を動かす方法

これよく見るけどやったことなかったやつ

意外と簡単に実装できた

cssは背景画像をno-repeatにするとレスポンシブ のときに高さが全然足りなかったので指定しなかった

以下js

$(window).on('scroll', function(){

  var scrollTop = $(window).scrollTop();
  var bgPosition = scrollTop / 2; //スクロール後のポジションを指定（値を大きくすると移動距離が小さくなる）

  if(bgPosition){
    $('#app').css('background-position', 'center top -'+ bgPosition + 'px');
  }
});

【jQuery】スクロールに合わせて背景画像の位置を動かす方法【パララックス】｜Into the Program