Safari / Webkit CSS滚动捕捉错误？

编程问答 2022-06-09

问题描述

我似乎无法使snap-snap在Safari（台式机或iOS）上正常工作。

当项目的内容比视口高时，会发生错误（？），在这种情况下，Safari会立即快速滚动到下一个项目，从而无法读取带有长文本的项目的内容。在Chrome，Firefox或Opera上不是这种情况，可以滚动浏览任何长的捕捉部分，并且捕捉到下一个项目的开头只会在该长项目的底部进行（可以读取）。

这里是一个演示：https://codepen.io/xfze/pen/YzWXdQv

使用的相关代码：

ul {
    max-height: 100vh;
    overflow: scroll;
    scroll-snap-type: y mandatory;
}
li {
    scroll-snap-align: start;
}

有没有人遇到过这种情况，使Safari表现为Chrome / Firefox / Opera？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

safariscrollwebkit