有啥方法可以禁用 CSS 滚动捕捉点？

Posted 2023-03-05

【中文标题】有啥方法可以禁用 CSS 滚动捕捉点？

【英文标题】：Any way to disable CSS scroll snap points?有什么方法可以禁用 CSS 滚动捕捉点？

【发布时间】：2018-06-12 19:42:01

【问题描述】：

我有一个单页移动引导站点，当滚动时，固定导航栏会在点击导航菜单中的链接时覆盖部分标题。我发现这是由 CSS 滚动捕捉点引起的。我尝试在所有部分的.section 类上设置scroll-snap-type: none;，但它仍然会产生错误。如何正确禁用整个页面的 CSS 滚动捕捉点？

【问题讨论】：

请提供类似 jsfiddle 的示例。

@Sharvan 由于页面很大并且可能存在外部脚本干扰，我不能简单地在小范围内重现问题。但是，这里有一个开发站点的链接：dev.spacecoastsites.com

links 说-您没有权限访问此服务器上的 /。

@Sharvan 需要美国 *** 才能访问该站点。

【参考方案1】：

也许会有所帮助。试试下面

 * Keyword values */
scroll-snap-type: none;
scroll-snap-type: mandatory;
scroll-snap-type: proximity;

/* Global values */
scroll-snap-type: inherit;
scroll-snap-type: initial;
scroll-snap-type: unset;

同Y follow.(scroll-snap-type-y)

   /* Keyword values */
scroll-snap-type-x: none;
scroll-snap-type-x: mandatory;
scroll-snap-type-x: proximity;

/* Global values */
scroll-snap-type-x: inherit;
scroll-snap-type-x: initial;
scroll-snap-type-x: unset;

【讨论】：

scroll-snap-type-x 和 scroll-snap-type-y 根据 developer.mozilla.org/en-US/docs/Web/CSS/scroll-snap-type-x 和 developer.mozilla.org/en-US/docs/Web/CSS/scroll-snap-type-y 在非标准轨道上。不过，他们并没有解决问题。

无例难查