【问题标题】:Hide <div> tag once the client starts scrolling down via CSS or Javascript一旦客户端开始通过 CSS 或 Javascript 向下滚动,隐藏 <div> 标记
【发布时间】:2025-12-22 10:10:15
【问题描述】:

是否可以在用户开始向下滚动时隐藏 div 并在他/她滚动回到最顶部时重新出现?

如果是,谁能告诉我如何或一个例子?非常感谢。

测试内容

【问题讨论】:

  • 这是很有可能的,如果你研究一下,可以在网上找到很多例子...... 2.4k 声誉,你发布这样的问题?您应该知道您的源代码示例和尝试还应该包括对特定问题的详细描述。 *.com/help/how-to-ask
  • 这个问题之前有人问过。检查下面的链接*.com/questions/32665784/…

标签: javascript html scroll hide visibility


【解决方案1】:

有很多方法可以实现这一点。这是JSFiddle. 上的一个示例,它使用 JavaScript:

$(window).scroll(function() {

    if ($(this).scrollTop()>0)
     {
        $('.fade').fadeOut();
     }
    else
     {
      $('.fade').fadeIn();
     }
 });

和 CSS:

body {
    height: 2000px;    
}
.fade {
    height: 300px;
    width: 300px;
    background-color: #d15757;
    color: #fff;
    padding: 10px;
}

【讨论】:

  • 这需要jQuery,它没有在这个问题中被标记。我认为最好在提供这样的解决方案之前询问是否可以选择使用 jQuery 库,或者在您的答案中清楚地解释 jQuery 的使用并链接到该库。