隐藏内容滚动的 HTML 正文溢出

Question

我有一个 css 背景动画设置为溢出：隐藏在 body 标签上（下面的 Codepen）。

body {
overflow: hidden;
}

我也有常规页面内容，我仍然需要像往常一样滚动。

overflow:hidden 在 body 上显然防止了这种情况。 有什么办法可以在我的页面内容上保留定期滚动？

https://codepen.io/lowercase01/pen/GRrzQxG

Answer 1

我想出了一个解决方案，我认为可以解决您要解决的问题。 以下是我所做的总结。 我已将 .background div 包装到我称之为 .background-container 的内容中。然后我将 .background-container 高度设置为 0，从正文中删除 overflow:hidden，然后重新排列 div，使 .wrapper div 排在最后。

这是代码笔的链接，https://codepen.io/zukomgwili/pen/GRrzQeY。

Answer 2

如何在浏览器中隐藏滚动条（仍可滚动）

/* Webkit */
::-webkit-scrollbar {
  width: 0;
  height: 0;
}

/* Firefox */
html {
  scrollbar-width: none;
}