Question

我在iPhone上测试Select2 jQuery组件，我所做的就是打开他们的演示网站：

如果您在手机上测试他们的状态示例，滚动不会对压力做出反应并且不会平滑地消失。这是一个粗线滚动。移动拇指时，线条不会淡入和淡出。

另一方面，在桌面上滚动/淡入效果很好。它可以优雅地响应鼠标滚轮。

只是想知道有没有人注意到这一点？

编辑看起来像iOS（与Android不同）需要

<div style="-webkit-overflow-scrolling: touch;">

Answer 1

阅读你的答案，如何将-webkit-overflow-scrolling: touch;属性添加到select2元素并不是很清楚，所以我决定给出更详细的答案：

根据规范（https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-overflow-scrolling），-webkit-overflow-scrolling CSS属性控制触摸设备是否对给定元素使用基于动量的滚动。

touch值意味着在完成滚动手势并将手指从触摸屏上移开后，内容会继续滚动一段时间。

但是，此属性仅适用于iOS设备。即使没有它，Android也能正常运行。

我们必须将此属性附加到包含建议的下拉元素 - .select2-results__options。

在select2 css样式后添加以下代码：

.select2-results__options {
    -webkit-overflow-scrolling: touch;
}

（以下演示包含两个select2实例，以便更好地比较滚动效果）