如何实现滚动捕捉停止：总是；
Posted
技术标签:
【中文标题】如何实现滚动捕捉停止：总是；【英文标题】：how to implement scroll snap stop:always; 【发布时间】：2021-02-13 20:14:06 【问题描述】：我创建了一个水平滚动条，但我试图控制用户在手机屏幕上滑动时的滚动方式。在这种情况下，当用户用力滑动时，他们仍然会被带到 B 区，而不是直接到 D 区。因此，如果一个人想要移动到 D 区，他们将不得不在屏幕上滑动 3 次，而不仅仅是一次强大的滑动刷卡。我试过使用 scroll-snap-stop: always;但这似乎没有帮助
<!DOCTYPE html>
<html>
<head>
<style>
body
margin:0;
padding:0;
width:100%;
#we
scroll-snap-type: x mandatory;
flex-basis: 50%;
scroll-snap-stop: always;
display:flex;
overflow:scroll;
width:100%;
position:absolute;
#we section
position:relative;
scroll-snap-align: start;
margin-top:100px;
min-width:100%;
height:auto;
display:block;
</style>
</head>
<body>
<div id="we">
<section>A
</section>
<section>B<br>
</section>
<section > C <br>
</section>
<section > D <br>
</section>
</div>
</body>
</html>
【问题讨论】：
【参考方案1】：请使用scroll-snap-stop: normal 来获得您想要的流畅运动和
refer this.
【讨论】：
以上是关于如何实现滚动捕捉停止：总是；的主要内容，如果未能解决你的问题，请参考以下文章