＜jQuery＞スクロール量に応じて、アイテムを表示させる

Question

サンプルコード

CODEPEN

質問内容

・もっと効率的なコードを書くことは可能でしょうか？

課題

個人的に何故か気持ち悪く感じてしまうのですが、以下なども特に問題ないでしょうか？
$(window).on('load', function() { の中に、$(window).scroll(function() {

よろしくお願い致します。

=======================追記===========================

コード修正
CODEPEN

Answer 1

ざっくりこんな感じで

$(function(){
  $(window).scroll(function() {
    var scroll = $(this).scrollTop();
    $('.mv').each(function(){
      if(scroll > $(this).offset().top) {
        $(this).find('.arrow').addClass('active');
      }
    });
  });
  $('a[href^="#"]').on('click',function(e){
    e.preventDefault();
    var speed = 400;
    var target = $($(this).attr("href"));
    var position = target.offset().top + 1;
    $('body,html').animate({scrollTop:position}, speed, 'swing');
  });
});

Comments

[decteckaaaaaaaa]

ご回答ありがとうございます！
今回は画像を使用していないですが、
コンテンツに画像が含まれる場合は、window.loadにした方が良いということであっているでしょうか？

また、.mv内に複数アンカーを設置した際にも上手く作動するようにしたいのですが
どうでしょうか？（追記に修正したコードリンクを記載しました）

よろしくお願いします。