javascript - HTML5 div 内的一页滚动

标签 javascript jquery html jquery-scrollify onepage-scroll

我正在这个网站上工作(HTML5,CSS3和JS),它有2个div(页眉和页脚),其中有CSS 位置:固定,并且有一个中心div,其中有position:absolute 并包含内容。

我想做的是在这个具有绝对定位的中心 div 内实现滚动捕捉。但由于某种原因我无法做到这一点。这是我尝试使用的jquery插件:https://github.com/peachananr/onepage-scroll

你们能帮帮我吗?

这是一个 JSFiddle,其设置我正在尝试:https://jsfiddle.net/icyyd/dswsg96d/

最佳答案

您必须为容器提供一定的固定高度,然后将overflow属性应用于auto。当容器的内容超过某个固定高度时,它会让您在容器内滚动。请参阅以下内容:

div.container{
 height: 80vh; //making height fixed in order to implement overflow property
 overflow: auto; //it will give you scroll effect when content height exceeds 80vh;
}

记住给高度一个固定的高度,即以 px/vh/vw 为单位。如果您给出像 % 这样的相对高度,它将不起作用 希望有帮助

关于javascript - HTML5 div 内的一页滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41864926/

相关文章:

如果用户点击其他地方,Javascript 关闭对话框

javascript - 如何检查 jquery 是否从外部 JS 文件加载?

javascript - Bootstrap 4 警告框关闭按钮未对齐

javascript - 使用 jQuery 删除多个文本区域框

javascript - jquery simplecontextmenu 插件的扩展功能

javascript - 显示隐藏密码

JavaScript onkeypress 延迟触发

javascript - 当 jQuery 更改框高度时,Bootstrap scrollspy 不起作用

javascript - 不要在滚动时触发 JQuery 操作

作为独立库的 Javascript 查询选择器 DSL