javascript - 创建滚动到第二部分后出现的导航栏

标签 javascript jquery html css

<分区>


我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题,以便用事实和引用来回答。

关闭 6 年前

我需要创建类似 that 的东西

我的理解是,无论窗口大小如何,背景都会调整大小以完美适应,一旦我向下滚动,导航栏就会变得可见并固定在顶部。

我相信我将需要 javascript(?),显然还需要 HTML 和 CSS。

任何提示,甚至是搜索内容,我们都将不胜感激。

最佳答案

只需在谷歌上搜索“粘性导航”之类的内容。这是我找到(使用 jquery)并编辑的代码笔: https://codepen.io/anon/pen/NABAxd .

这个想法非常简单:您将处理程序附加到 scroll 事件以检查用户是否向下滚动了一定量。基于此,您将 position:fixed 应用或删除到元素。您可以通过 window.pageYOffset 找到从顶部滚动的像素数量。

编辑: 您可以将 height: 100vh 设置为第一部分以覆盖整个浏览器窗口。我已经编辑了代码笔。

关于javascript - 创建滚动到第二部分后出现的导航栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38656253/

上一篇:html - 如何在另一个div中水平居中div

下一篇:html - 左侧没有工作空间的纯视差效果

相关文章:

javascript - 时间戳中的错误日期

c# - doPostBack 无法正常工作

html - CSS - 如何使位置 :absolute work not on all 100% screens area

html - Scrapy - 从具有特定属性值的链接中提取 href

javascript - 如何使用 Ajax 调用将列表传递给 Spring MVC Controller

javascript - 在 JavaScript 中创建一个 n 维数组

PHP mysql_query() 无法查询请求的 sql

javascript - 如何制作一个取消选中所有复选框的按钮?

jquery - 使用 Jquery 随机设置图像的宽度

html - safari html 中的土耳其字符不在正确的字体系列中