Javascript 按钮淡入屏幕底部

我的页脚上有一个按钮，当用户到达屏幕底部时，这个按钮就会消失

HTML-内部标记

 <script>
$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() == $(document).height()){
    isShown = true;
    $('.footer-btn').fadeIn(500);
}
});
</script>

$（窗口）。滚动（函数（）{
if（$（窗口）.scrollTop（）+$（窗口）.height（）==$（文档）.height（））{
isShown=真；
$（'.footer btn'）.fadeIn（500）；
}
});

---

我希望它在用户到达底部之前在150像素内淡入，而不是绝对底部。我还希望它淡出时，用户滚动回来。但我不确定如何添加到我的代码中以实现它。

从文档高度减去150，然后在fedout中写入else

<script>
$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() == $(document).height()-150){
    isShown = true;
    $('.footer-btn').fadeIn(500);
}else{
    $('.footer-btn').fadeOut(500);
}
});
</script>

$（窗口）。滚动（函数（）{
if（$（窗口）.scrollTop（）+$（窗口）.height（）==$（文档）.height（）-150）{
isShown=真；
$（'.footer btn'）.fadeIn（500）；
}否则{
$（'.footer btn'）。淡出（500）；
}
});

试试这个：

$(window).scroll(function () {
    if ($(window).scrollTop() + $(window).height() > ($(document).height() - 150)) {
        $(".btn").fadeIn(1000);
    } else {
        $(".btn").fadeOut(1000);
    }
});

---

这里的工作小提琴：

太棒了，答案和提供的一样，几乎是同一时间。我发现我使用了>而不是==。这只是为了安全起见=）