Jquery '；返回顶部'；在页脚的滚动顶部

使用我在周围看到的一些示例，当您向下滚动页面时，我会出现一个返回顶部的按钮，但是有没有办法使按钮粘到屏幕底部，直到您到达页脚，它会粘到页脚顶部

这是我目前的代码：

<script type="text/javascript" defer="defer">
    $(window).scroll(function() {
        if ($(this).scrollTop()) {
            $("#toTop").fadeIn();
        } else {
            $("#toTop").fadeOut();
        }
    });


    $("#toTop").click(function() {
        $("html, body").animate({scrollTop: 0}, 1000);
    });
</script>

<style type="text/css">
    .backtotop_button_wrap {width:100%; background:white; height:auto;}
    .backtotop_button_height {width:100%; height:55px;}
    #toTop {display:none; position: fixed; right:0; bottom:0; width:100px; height:auto; background:white; float:right; padding:10px; text-align:center; border:1px solid black; line-height:12px;}
    #footer {width:100%; height:500px; color:white; text-align:center; background:#313131; border-top:1px solid black;}
</style>

<div class="backtotop_button_wrap">
    <div class="backtotop_button_height">
        <div id="toTop">^<br />Back to the Top</div>
    </div>
</div>
<div id="footer">
Footer
</div>

$（窗口）。滚动（函数（）{
if（$（this.scrollTop（））{
$（“#toTop”）.fadeIn（）；
}否则{
$（“#toTop”）.fadeOut（）；
}
});
$（“#toTop”）。单击（函数（）{
$（“html，body”）.animate（{scrollTop:0}，1000）；
});
.backtotop_按钮_wrap{宽度：100%；背景：白色；高度：自动；}
.backtotop_按钮_高度{宽度：100%；高度：55px；}
#toTop{显示：无；位置：固定；右侧：0；底部：0；宽度：100px；高度：自动；背景：白色；浮动：右侧；填充：10px；文本对齐：中心；边框：1px纯黑色；线条高度：12px；}
#页脚{宽度：100%；高度：500px；颜色：白色；文本对齐：中心；背景：#313131；边框顶部：1px纯黑；}
^
返回顶部
页脚

---

我还在这里做了一个Jfiddle:

将#toTop的html位置更改为#页脚。 当窗口达到页脚高度时#toTop从固定变为相对

     if($(window).scrollTop() + $(window).height() < $(document).height() - $("#footer").height()){
            $('#toTop').css("position","fixed");    //resetting it
            $('#toTop').css("bottom","0"); //resetting it
}
else {
            $('#toTop').css("position","relative"); // make it related
            $('#toTop').css("bottom","60px"); // 60 px, height of #toTop
 }

if（$（窗口）.scrollTop（）+$（窗口）.height（）<$（文档）.height（）-$（“#页脚”）.height（））{
$（'#toTop'）.css（“位置”，“固定”）；//重置它
$（'#toTop'）.css（“底部”，“0”）；//重置它
}
否则{
$（'#toTop'）.css（“位置”，“相对”）；//使其相关
$（'#toTop'）.css（“底部”，“60px”）//60px，高度为#toTop
}

JSFIDLE

---

您需要返回顶部才能始终显示您的意思是让它停在页脚处吗？或者也可以看到“返回顶部”框？因为在jfiddle中，如果你向下滚动预览平面，它应该沿着底部显示框，这就是我想要它做的，但是在页脚开始处停止滚动。明白了。所以页脚应该把框推到上面？这很好，但是最好切换类而不是切换样式。