javascript - スクロール時に異なる時間に 2 つの div をフェードアウト/フェードインする

Question

基本的に、私はこのサイトと同様の効果を再現しようとしています: http://www.falve.co.nz/collection/下にスクロールするとナビゲーションがすぐにフェードアウトし、スクロールを続けるとヒーローのテキストがゆっくりとフェードアウトしますスクロール位置に応じてアウト。スクロールして一番上に戻ると、すべてが再びフェードインし、最初にヒーロー テキストが表示され、次にナビゲーションが表示されます。

これを複製しようとしていますが、以下のコードは単に機能しません:

// Global vars
  var $artHeaderInner = $('#scene');
  var $nav = $('#prim');
  var windowScroll;

    // Functional parallaxing calculations
    function slidingTitle() {

        //Get scroll position of window
        windowScroll = $(this).scrollTop();

        //Slow scroll of .art-header-inner scroll and fade it out

        $artHeaderInner.css({
            'margin-top' : -(windowScroll/3)+"px",
            'opacity' : 1-(windowScroll/550)
        });

        //Fade the .nav out
        $nav.css({
            'opacity' : 1-(windowScroll/400)
        });
    }