javascript-Chrome应用程序Webview和触摸滚动传播

我很高兴将Windows 8 Metro应用程序替换为Chrome打包的应用程序。 目前,它需要模仿Metro应用的外观。 主页包含水平排列的多个Web视图,并可能进行大量的水平滚动。 尝试使用触摸设备水平滚动时遇到问题。 如果滚动手势在Web视图上开始,则表示正在捕获滚动事件并阻止主机滚动。 溢出在所有Web视图上均被隐藏。 由于它们构成了页面上大部分内容,因此主机的有效滚动目标受到限制。

Webview的内容是交互式的,因此我无法在可滚动内容上放置透明的覆盖层来捕获事件,至少没有某种方法可以将点击/触摸传播到WebView本身。

关于如何实现的任何想法?

谢谢你的帮助!

powski asked 2020-02-29T10:29:04Z
2个解决方案
1 votes

我将在这里假设一些事情:     设置Chrome应用的样式类似于设置网页的样式。     您当前的滚动解决方案依赖于使用overflow:hidden和仅使用JavaScript进行滚动。

我为页面修复了类似的内容。 这很奇怪,但我了解到,对于触摸设备,除非用户与之交互,否则滚动条是不可见的。 如果将样式更改为overflow-x:滚动...将出现一个滚动条(以后需要使用Modernizr或其他类似方法来检测启用触摸的设备,然后再将其用于桌面)。 然后注释掉您的滚动代码(当然是暂时的,因为非触摸需要它)。 如果它随着溢出更改和scrolipt更改滚动得很好,那么接下来您要做的就是检测触摸并有条件地打开脚本并适当地更改溢出。

DarthDerrr answered 2020-02-29T10:29:23Z
0 votes

如果您可以使用jQuery来实现它,那么请确保当光标不在Web视图顶部时,它将滚动事件应用于页面本身。

Ted answered 2020-02-29T10:29:43Z
translate from https://stackoverflow.com:/questions/25246670/chrome-app-webview-and-touch-scroll-propagation