当从顶部向下滚动100px时，如何使div消失?

I want to make a div disappear when I scroll down 100px and then reappear when within those 100px again from the top of the browser window. I don't want any animations just want it to vanish and reappear. Can this be done in just HTML and CSS? Can someone provide me the code for this please?

我想让div在向下滚动100px时消失，然后在浏览器窗口顶部的100px中再次出现。我不想要任何动画只是想让它消失和重新出现。这能只用HTML和CSS实现吗?有人能给我这个的代码吗?

Thanks in advance, Matt

谢谢你提前,马特

1 个解决方案

#1

You wont be able to do this in pure HTML or CSS, you'll need to resort to Javascript, your best bet is likely jQuery- as such it can be relatively easy to do this using:

你不能用纯HTML或CSS来做这个，你需要使用Javascript，你最好的选择可能是jQuery——因此用以下方法来做这件事相对容易:

$(window).bind('scroll', function() {
     if ($(window).scrollTop() > 100) {
         $('#myDivId').hide();
     }
     else {
         $('#myDivId').show();
     }
});