当滚动为100％底部时，滚动到底部按钮行为

我使用jquery-smooth-scroll来控制锚点滚动。有一个功能/选项可以在滚动后决定行为。我选择隐藏按钮到底部锚点后。然后，当页面底部的滚动不再是100％时，我实现了一些jQuery来将该按钮返回。当滚动为100％底部时，滚动到底部按钮行为

我正在努力做的是确保滚动100％时按钮总是消失。标准的返回顶部工作方式相同，但在我的情况下页面的两端。

请参阅本拨弄我已经把https://jsfiddle.net/k253jvt8/

/* show and hide button*/ 
$(window).bind("mousewheel DOMMouseScroll scroll", function (e) { 

    if (document.body.scrollTop == 0) { 
    $('.saveForm').fadeIn(); 
    //below isnt working to fade away .saveform when scroll is 100% bottom 
    } else { 
    $('.saveForm').fadeOut(); 
    } 
});

以上是我用带回的按钮，它消失后的代码，但当时不能得到它再次消失的时候手动滚动至底部，当我使用按钮到达底部时，它只会再次消失 - 与我的小提琴一起玩，你会明白我的意思。

来源

2017-07-19 Tom Rudge

即使你的fadeIn（）似乎不起作用！它总是可见的，因为我在函数中注释了整个if-else。 –

在按钮被点击并且滚动位于底部之后，淡入功能起作用，一旦你开始向上滚动，它将在 –

中淡入淡出。另外，我只想按钮在底部100％时消失。它应该保持99％的时间，除非滚动条在底部为100％ –

在你的小提琴中，你的包装<div class="reportFormPage">相对于文档是绝对定位的。

因此，您的<body>元素在确定其高度时没有考虑到它;因此它总是有一个0的高度值。因此，你的'其他'条件永远不会发生。

删除position: absolute; css规则可以解决此问题。

来源

2017-07-19 10:09:34 dommmm

通过删除绝对滚动不再起作用，并且按钮在页面顶部而不是底部消失 –

基本上，我总是需要按钮保持可见，除非它在页面底部，它需要在底部隐藏。目前我只能在按钮被点击后才能做到这一点。我需要它工作时手动滚动到底部 –

https://jsfiddle.net/bnxzy9kb/确定所以这让我更接近，但需要按钮留在那里所有的时间，除非100％在页面的底部？ –

试试这个

if ($(window).scrollTop() ==0) { 
    $('.saveForm').fadeIn(); 
    } else if($(window).scrollTop() < $(document).height()) { 
    $('.saveForm').fadeOut(); 
    } 
});

与作为dommmm说移除position:absolute一起。

这里是工作提琴https://jsfiddle.net/sd6sh4v6/2/

看看你是否喜欢我用无JS后备带给您smoothScroll的变化。

来源

2017-07-19 10:20:26

不，这不起作用，平滑滚动不再起作用。当你点击小提琴中的按钮时，它会消失，但不会滚动到底部。 –

我已经更新了我的答案。对于与'smoothScroll'有关的清理造成的不便，我深表歉意。 –

谢谢，不用担心。不幸的是，我需要我使用的平滑滚动和所用类的绝对值 –

当滚动为100％底部时，滚动到底部按钮行为

回答

相关问题