0

我正在尝试使我的网站对平板电脑友好，但我遇到了一个奇怪的问题。

我正在使用 Chrome 30 的 Android 4.0 平板电脑上进行测试。

我有一个固定的模式弹出屏幕。当这个屏幕打开时，我们不想让用户滚动背景以防止触摸事件。但是，在此窗口中，我们有一个带有 的可滚动区域overflow:scroll，因此如果在此处检测到触摸开始事件，则不会阻止触摸事件。到目前为止一切顺利 - Android 按预期负责任地滚动该区域。

问题是，如果用户在滚动区域内长按一个元素大约半秒钟，然后才滚动 - 触摸开始的元素似乎被选中了一会儿。该选择会在一段时间后消失。但是，如果用户在该位期间滚动- 整个页面滚动而不是可滚动区域。好像焦点变了一样。这是怎么回事？

我试图在里面的元素上设置 CSS 选择规则，但没有帮助。

-webkit-touch-callout:none;
-webkit-user-select:none;
-khtml-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;

每个其他答案都建议防止触摸事件，因为它是要滚动的。任何想法是什么原因造成的？

4

1 回答 1

0

好，我知道了。

添加cursor:default!important到上面的 CSS 规则中。

我确实遇到过这样的解决方案，但在第一次尝试时失败了。在我的情况下，可滚动区域内的元素的特异性太强，渲染cursor:default无用，我没有意识到这一点。我通过检测用户代理仅将其应用于移动设备，因此我可以消除以前的cursor属性，!important因为它不会影响任何桌面客户端。甜的！

仍然不确定为什么会这样。如果有人能提供有关该cursor属性如何影响 Android 上的 Chrome 的信息，我将不胜感激。

于 2013-10-20T20:51:34.107 回答