jquery - スクロールしてポイントを通過したときにナビゲーションをアニメーション化する

Question

ナビゲーション メニューをアニメーション化 (上からスライドイン) しようとしていますが、scroll() 関数によってトリガーされます。ユーザーのスクロールが 40 を超えた場合、ナビゲーション メニューをアニメーション化する必要があります。ユーザーが 40 回未満スクロールすると、ナビゲーション メニューは再びアニメーション化する (上にスライドする) 必要があります。

以下の jsFiddle のコードで動作しますが、ユーザーが 40 を超えて下にスクロールすると、スクロールするたびに関数が呼び出されるため、ナビゲーション メニューが非常にゆっくりとスムーズに下にスライドしません。

誰かが別の関数を使用してからscroll()を修正する方法を知っていますか? ありがとう！

これがjsFiddleで、以下が jQuery コードです。

$(document).ready(function() {

    /** HIDE MENU **/
    $(".menu").css("margin-top", "-88px");

    $(window).scroll(function() {

        var verschil = ($(window).scrollTop() / 5);

        if (verschil > 40) 
        $('.menu').animate({'margin-top': '0px' }, {duration: 500, queue: false});

        else if (verschil < 40)
        $('.menu').animate({'margin-top': '-88px' }, {duration: 500, queue: false});
    });

});