use*_*900 3 html css google-chrome
尝试确定这是否是 Chrome 或我的代码的错误。使用下面的代码，当我向下滚动时，它会执行我想要的操作，但是当我向上滚动时，它可以让我滚动到我想要的高度，而不会导致主体弹回。我已将滚动捕捉应用到 html，因为它在 Chrome 中不起作用（如果在 body 上）。
演示： http: //manifest.thedevtest.com/scrollsnap/（向上滚动）
代码：
<html>
<head>
<title>Chrome Scroll Snap Issue Demo</title>
<style>
* {
margin: 0;
padding: 0;
}
html {
scroll-snap-type: mandatory;
scroll-snap-points-y: repeat(100vh);
scroll-snap-type: y mandatory;
background: red;
}
section {
height: 100vh;
width: 100vw;
scroll-snap-align: start;
}
.foo {
background-color: green;
}
.bar {
background-color: blue;
}
</style>
</head>
<body>
<section class="foo">
</section>
<section class="bar">
</section>
</body>
</html>
你们能复制这种情况吗？如果是的话，您有什么想法可以防止这种情况发生吗？
我还没有确定这是否是 chrome 的错误，但修复方法是管理过度滚动行为（可以在 Chrome 中完成）https://developers.google.com/web/updates/2017/11 /过度滚动行为
body {
overscroll-behavior-y: none;
}
做这份工作。感谢 reddit 上的 /u/Anemina。https://old.reddit.com/r/css/comments/i9kkiw/scroll_snap_bug_chrome_on_mac/