使用 CSS overscroll-behavior: contain 来防止滚动链

当用户滚动嵌入的网页（或网页上的任何嵌套滚动容器）并到达末尾时，浏览器将开始滚动外部页面。这被称为滚动链。

滚动链是指滚动从一个滚动容器传播到滚动链后面的祖先滚动容器。

一些用户可能会觉得这种行为很烦人。幸运的是，可以通过将 overscroll behavior: contain 应用于嵌入页面（或滚动容器）的 <body> 元素来禁用滚动链接。。

body {
  overscroll-behavior: contain;
}

Firefox、Chromium 和 Edge 通过 AutoRefixer 支持此功能，但 Safari 目前还不支持此功能：

overscroll-behavior 支持情况

查看效果

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容