如何检测粘性元素何时固定

Avatar of Chris Coyier
Chris Coyier

DigitalOcean 为您旅程的每个阶段提供云产品。 立即开始使用 200 美元的免费积分!

完全同意 David 的观点,CSS 需要一个选择器来判断 position: sticky; 元素是否正在执行其粘性操作。

理想情况下,我们会使用一个 :stuck CSS 指令,但实际上我们能做的最好的方法是使用 CSS 技巧和一些 JavaScript 魔法,在元素变为粘性时应用一个 CSS 类。

我喜欢那些不是庞大的 polyfill 或其他东西的解决方案。 在这种情况下,只需几行 IntersectionObserver JavaScript 代码和在 CSS 中巧妙地使用 top: -1px

直接链接 →