javascript - 滚动时如何使元素粘在顶部

标签 javascript css

我正在创建一个我需要帮助的页面,我已经准备好 HTML 和 CSS,我想要的只是让元素在我向下滚动一点后回到顶部,并且必须有超过 5 个屏幕我需要在滚动时置顶

我找不到解决方案,所以需要帮助

这是我需要的链接,这正是我想要的 https://www.blackrock.com/corporate#intro

最佳答案

CSS

您需要的 CSS 属性是 position: sticky 意味着该元素将位于其各自的 relative 位置,直到您向下滚动足够多并到达顶部(如果您设置它的 top: 0) 然后会“粘”到顶部,就好像它立即将它的位置更改为 position: fixed。享受

以下代码可以帮助您实现所需的行为:

.sticky-container {
   position: sticky;
   top: 0;
   left: 0;
}

如果它是一个占据整个宽度的容器,那么还要添加 width: 100% 和一定的以像素为单位的固定高度以查看容器。

如果你想让元素在用户刚进入网站时默认保留在某个位置,你可能需要 position: fixed 而不是粘性。您可以查看固定位置的类似解决方案 here with a demo

关于javascript - 滚动时如何使元素粘在顶部,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58168003/

相关文章:

html - 拉伸(stretch)内容的div依赖

javascript - 如何使用 reduce 函数来简化这段代码

javascript - 动态更改在 EXPRESS js 和 NODE js 中运行的站点的样式

javascript - 将 jQuery 脚本挂接到 &lt;input&gt; 和 <button> 标签中

使用来自三个数组之一的图像的 JQuery 背景图像 slider

css - 有没有一种方法或标签可以使任何 HTML 元素居中?

javascript - 在页面向下滚动时创建固定位置的文本,然后停止在某个位置

javascript - 强制定时更新 CSS 文件

javascript - 合成:如何根据单选按钮中的选定选项动态更改 Canvas 新绘图?

javascript - jQuery 改变和点击事件