jquery - 如何实现平滑滚动以将内容带到视口(viewport)的中间而不是顶部?

标签 jquery css

我正在开发一个单页网站( trabo.in/raccoon/ ),在导航中选择后,网站的不同部分就会滚动到视口(viewport)中。目前,当选择导航中的链接时,相应部分会平滑滚动到视口(viewport)顶部,与浏览器顶部摩擦。然而,我试图让它滚动到视口(viewport)的中间,以便它像导航栏一样垂直居中。有什么方法可以在 jquery 中启用此功能吗?请随意浏览该网站上的 js,我不知道发生了什么......

非常感谢和良好的祝愿!

最佳答案

一个快速、低技术含量的解决方案是在 CSS 中为每个部分 DIV 提供顶部边距。这不会将其完全居中,但至少会阻止它接触屏幕顶部。

编辑: 我相信这个插件有一个选项,它会注意到边距: http://flesler.blogspot.com/2007/10/jqueryscrollto.html

关于jquery - 如何实现平滑滚动以将内容带到视口(viewport)的中间而不是顶部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9343676/

相关文章:

css - 字体大小可以是 css/css3 中容器大小的百分比吗?

javascript - 清除相对定位产生的空白并保持移动的对象不受影响

javascript - 如何在不将 overflow-x 更改为 auto 的情况下使 overflow-y 滚动?

css - 在 float 上对齐提交按钮?

javascript - 如何使用 jquery 扫描 JSON 以确定某个字符串的实例数量?

javascript - 获取值输入单选按钮 javascript

javascript - jQuery getJSON 无法看到 console.log

php - 如何使用 Ajax 与 Laravel 和 Restful Controller 从数据库中删除

jQuery Accordion 多个元素对齐

html - 元素之间的 flex 空间