向下滚动浏览器窗口底部的提示

Question

我正在开发一个庞大的单页网站，并希望在用户访问网站时在窗口底部显示向下滚动提示（图标或类似内容）。

当访问者向下滚动或点击图标时，提示应该消失。我已经在几个网站上看到了这个，我现在不记得了。已经搜索但没有结果，因为我可能正在搜索错误的关键字......

任何人都有任何指示从何处开始实现这一目标？

Answer 1

我认为你的图标/链接需要一个ID，然后有两个事件监听器。一个用于单击ID本身，另一个用于onscroll。触发其中任何一个事件后，您可以致电.remove()

Answer 2

这是让滚动提示正常工作的开始。现在关于样式，这取决于你，但我会亲自做position: absolute之类的工作，然后在那里工作并给它一个关于页面上所有内容的zIndex。

$(window).scroll( function() {
    if($(document).scrollTop() == 0 ) {
        // SHOW scroll hint
    } else {
        // HIDE scroll hint
    }
});

我是在自己的网页上做到的。

http://codepen.io/pattmorter/pen/mFDLs

只需查看javascript和css。

Answer 3

如果您不知道从哪里开始，请尝试阅读window对象的引用。对于可见性更改，您可以使用opacity和position属性将其固定在屏幕底部。