jquery - スクロール機能を使用して要素をアニメーション化する

Question

ドキュメントの準備ができているときに不透明度0で非表示になっているロゴがあります。ユーザーが400pxを超えてスクロールすると、ロゴがアニメーションで表示され、400px未満の場合はアニメーションで表示されなくなります。

現時点では、スクロールを開始するとアニメーションがオフになり、400px を超えてスクロールするとアニメーションが開始されます。スクロールの瞬間にアニメーションを終了させないようにする方法はありますか。 http://jsfiddle.net/r1chyr1ch/DT32G/3/ これが理にかなっていることを願っています。

$(document).ready(function(){
$('.menuLogo').css('opacity', 0);
$(window).scroll(function () {
    if ($(this).scrollTop() > 400) {
        $('.menuLogo').addClass('slideDown').removeClass('slideUp');
    } else {
        $('.menuLogo').removeClass('slideDown').addClass('slideUp');
        }
    });
});