Javascript 滚动时淡出并向上移动

我正在使用的以下脚本会随着class.fader一起淡出div。向下滚动时，它不会立即淡出，而是在滚动时一点一点地淡出

一切正常，但我怎样才能使div在衰退发生时向上移动呢

 //Fade Index on Scroll//
    var divs = $('.fader');
        $(window).on('scroll', function() {
    var st = $(this).scrollTop();
        divs.css({ 'opacity' : (1 - st/300) });
    });

    $(window).scroll(function() {
    if ($(this).scrollTop()>300) {
        $('.fader').fadeOut();
    } else {
        $('.fader').show();
        }
    });

HTML:

<div id="top-section">
   <div class="content fader">
       <h1>I support and guide you through the process of <span>change</span>, <span>growth</span> and <span>personal evolution</span>.</h1>
   </div>
</div>  

---

实时预览：

请替换下一行

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

与

您必须使用

bind

..

您可以使用：

$(".fader").animate({"opacity":(1 - st/300), "top": "-"+(st/300)},200);

编辑：

我不太明白你想要的效果，但这就是你想要的吗

$(".fader").animate({"opacity":(1 - st/300), "top": "-"+st},50);

---

你能提供完整的HTML代码吗？或者创建一个jsfiddle来更新问题。请重新看一看。你应该退房。这封信寄上去了，但我想跟在退色的后面。请看这里：几乎，我希望它更有序。。。因此，当您开始滚动时，div将在滚动时开始按顺序淡出，因此，如果您向上滚动，它将开始淡入，并且当它这样做时，它将在淡入时开始向上或向下移动-非常抱歉，这篇可怜的简报，不知道如何描述它：/n没问题…你应该根据自己的喜好调整它…尝试减少动画时间等。我可以去jQuery的网站查找它，但如果你包括“为什么”会很有帮助

$(".fader").animate({"opacity":(1 - st/300), "top": "-"+(st/300)},200);

$(".fader").animate({"opacity":(1 - st/300), "top": "-"+st},50);