Android浏览器上的滚动事件未触发。 需要解决方法
[英]Scroll event on Android Browser not firing. Need workaround
问题描述
我创建了一个带有视差街景的网站。 请参阅此处获取存档版本。
它适用于所有主流桌面浏览器和Safari Mobile。 它在Mobile Firefox和Chrome for Android Beta中也能很好地工作。 但是，默认的Android浏览器存在滚动事件的问题。 让我说清楚。 滚动不是问题。 div根据需要滚动。 滚动事件不会触发。 我在Honeycomb和ICS上遇到过这个问题。
我不关心其他移动浏览器，因为对于移动屏幕尺寸，人们通常看不到视差场景; mediaqueries和条件JavaScript加载可以解决这个问题。 响应式设计和所有爵士乐。
基本上，我写了一个parallise（）jQuery插件，根据它的位置和“深度”定位每个图像。 此函数绑定到scroll事件。
在Android浏览器中，此事件仅在下一次触摸开始时触发 ，而不是连续触发。
好的，所以我想也许如果我将功能绑定到touchstart ， touchmove和touchend事件我会解决我的问题。 没有雪茄。 其他触摸事件也被窃听。 应用建议的解决方法会导致事件触发，但由于我必须执行e.preventDefault() ，因此会禁用滚动（练习的整个点）。
如果我只是相对于窗口div轮询舞台div的位置怎么办？ 事实证明，位置信息仅在下一次触摸开始时更新。
我在我的系绳的尽头。 任何帮助将非常感激。
2 个解决方案
解决方案1
1 已采纳 2014-02-07 10:42:48
即使触摸事件在Android的错误版本上正常工作，并且您实际上能够在拖动期间有效地跟踪本机滚动位置，这也很容易出错。 例如，它不会考虑触摸完成后发生的动量动画。
iOS和Android做出牺牲以提高滚动性能。 在两个平台上，在滚动完成之前，无法获得准确的滚动位置。 滚动事件（在<body> ）在动量动画完成之前不会触发。 因此，虽然您的原始问题是关于溢出的<div>上的滚动事件，但修复此问题可能对您完全没有帮助。
如果您希望动画能够及时更新滚动，则需要以编程方式执行滚动，而不是使用浏览器的本机滚动。 最好的库是iScroll 。 如本演示所示，您可以非常轻松地实现视差效果。
如果您需要更复杂的效果（在您的示例中为行走角色），您可以选择iScroll的“探测”版本，它允许像素完美轮询滚动位置以换取降低的性能。
但是，使用iScroll有许多缺点：
- 您可能需要更改标记和样式
- 这对于桌面浏览器来说是不必要的开销，但由于标记更改可能难以仅作为后备使用
- 滚动感觉不会很完美 - 在iOS上，通常具有出色的滚动性能 - 动量计算的细微差别可能会让人觉得不耐烦。 在Android上，滚动可能比平常更加滞后。
解决方案2
0 2014-08-06 09:49:39
在touchstart上滑动不需要防止默认的垫片： https ： //github.com/TNT-RoX/android-swipe-shim
jQuery事件未触发。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.