Javascript 如何在页面底部，但在（非固定）页脚上方创建固定的“转到顶部”按钮？

我在Shopify上做了一个页面，在左下角做了一个固定的上箭头。没关系，但当我滚动到页面底部时，箭头将位于页脚前面，我希望它保持在页脚上方

以下是我使用的代码：

$document.readyfunction{ $window.scroll函数{ 如果$this.scrollTop>200{ $“.go top.”fadeIn200； }否则{ $进入顶部。淡出200； } }; $'。转到顶部。单击函数事件{ 违约事件； $'html，body'。动画{scrollTop:0}，300； } }; .上{ 位置：固定； 底部：2米； 右：0.5em； 文字装饰：无； 字体大小：40px； } 将z索引添加到css中。 比如：

z-index: 100000

使数字尽可能大，使其位于顶部。

将z索引添加到css中。 比如：

z-index: 100000

使数字尽可能大，使其位于顶部。

$document.readyfunction{ $window.scroll函数{ //--------------添加的行------------// var footertop=$'.footer'.position.top； var scrolltop=$document.scrolltop+window.innerHeight； var差异=滚动页脚TOTOP； 如果scrolltop>footertotop{ $'.go top'.css{'bottom'：差}； }否则{ $'.go top'.css{'bottom'：10}； }; //--------------结束-----------------// 如果$this.scrollTop>200{ $“.go top.”fadeIn200； }否则{ $进入顶部。淡出200； } }; $'。转到顶部。单击函数事件{ 违约事件； $'html，body'。动画{scrollTop:0}，300； } }; .container{高度：2000px；位置：相对} .footer{高度：200px；宽度：100%；位置：绝对；底部：0px；背景：红色} .上{ 位置：固定； 底部：20px； 显示：无；// $document.readyfunction{ $window.scroll函数{ //--------------添加的行------------// var footertop=$'.footer'.position.top； var scrolltop=$document.scrolltop+window.innerHeight； var差异=滚动页脚TOTOP； 如果scrolltop>footertotop{ $'.go top'.css{'bottom'：差}； }否则{ $'.go top'.css{'bottom'：10}； }; //--------------结束-----------------// 如果$this.scrollTop>200{ $“.go top.”fadeIn200； }否则{ $进入顶部。淡出200； } }; $'。转到顶部。单击函数事件{ 违约事件； $'html，body'。动画{scrollTop:0}，300； } }; .container{高度：2000px；位置：相对} .footer{高度：200px；宽度：100%；位置：绝对；底部：0px；背景：红色} .上{ 位置：固定； 底部：20px；

---

display:none；//使用z-indexset设置windows侦听器，当页面到达页面底部时，根据页面更改bottom属性position@ScottMarcus我不认为把他的代码改成代码段是件好事，因为没有什么东西可以看出来是有效的……我认为代码段不应该是自动生成的，它应该是ma关于完整工作代码的说明，我们可以在其中看到一个行为如何将$'a.go-top'作为footer的一个子项？@Temaniaf如果出于三个原因使用代码片段是一个好主意。1我们现在可以运行代码并可视化OP制作的正在工作的UI 2我们可以立即看到是否存在可能OP没有发现的语法错误现在，任何人都可以单击“复制代码段”来回答问题并创建一个完全运行的解决方案。通常，没有太多理由不使用代码段。使用z-indexset设置windows侦听器，当页面到达页面底部时，根据页面更改bottom属性position@ScottMarcus我不这么认为，改变他的想法很好将代码片段转换为代码片段，因为没有任何东西可以看到它在工作……我认为代码片段对于任何代码都不应该是自动的，它应该只对我们可以看到行为的完整工作代码是强制性的。将$'a.go-top'作为footer的一个子元素怎么样？@temaniaf如果使用代码片段是一个好主意，有三个原因。1我们现在可以运行代码并可视化OP制作的正在运行的UI 2我们可以立即看到是否存在OP没有发现的语法错误，3现在任何人都可以单击“复制代码段”来回答并创建一个完全运行的解决方案。一般来说，没有太多理由不使用代码段。虽然这是正确的方向，但我建议使用t为了达到一个Z指数梦魇，想要达到预期的结果的最低可能值。考虑到一个弹出式模式，你可能希望它的背面在上面。当这是正确的方向时，我建议使用尽可能低的值来达到预期的结果，以防止Z指数噩梦。你可能会想要它下面的背面到顶部。