javascript - 当用户到达页面底部时隐藏 div

Question

我想在用户滚动并到达页面底部时隐藏一个 div 元素，并在用户向上滚动时再次显示它。例如考虑以下名为“nav”的导航栏。

HTML

<div class="nav"></div>

CSS

.nav{
 width:100%;
 height:50px;
 position:fixed;
 }

我想在滚动到网页底部时隐藏 nav div 元素。我怎样才能使这成为可能。我可以为此使用 CSS 还是应该改用 JavaScipt。

Answer 1

HTML

<div id="nav"></div> 

JS

document.onscroll = function() {
        if (window.innerHeight + window.scrollY > document.body.clientHeight) {
            document.getElementById('nav').style.display='none';
        }
    }

fiddle :https://jsfiddle.net/k77fdzyu/1/