手机浏览器中$（window）.scroll事件的触发率

我使用$(window).scroll()事件来为我的元素添加动画。

在桌面浏览器中，当鼠标是滚动时触发事件。
在移动浏览器中，当拖动&触摸具有结束时触发事件。

有什么办法可以在触摸拖动的时候触发scroll()事件（向下滚动/向上滚动）？

示例代码：

$(window).scroll(function(){ 
    console.log('fired'); 
});

最后，这里有一个demo page（不能在移动使用的jsfiddle很好，因而我别处承载它）。请在桌面上尝试一下&移动浏览器。为方便起见，这里是QR码：

enter image description here

来源

2014-01-11 Raptor

我有点觉得绑定'touchmove'可以帮助 – Alexander

@Alexander它不会帮助当我们有动力滚动 – Dan

@丹，够公平的。虽然，这个问题不是关于动态滚动 – Alexander

我一直在玩的手机和触摸最流行的浏览器捕捉实时滚动设备超过一周！

我试图像把setInterval或环或捕捉scroll或touchmove或网络工作者或任何许多方法。我可以告诉你，在iOS 4 - 7上没有任何工作，浏览器只会冻结任何脚本执行。适用于Android的浏览器，移动Chrome或Firefox或海豚跟踪scroll好吧，您可以在这里处理动态滚动。最新的Internet Explorer移动版，Blackberry，Opera移动版以及大多数Symbian浏览器也跟踪scroll。

但是，在iOS上有一种很棒的方式来做事。这个人模仿使用CSS3滚动transform: translateY：https://github.com/joehewitt/scrollability/blob/master/scrollability.js实际上，JavaScript/CSS完全模拟iOS Safari本身的功能。

由于使用GPU加速度而没有任何延迟，并且没有任何限制。您甚至可以更改滚动参数，如摩擦或响应度。缺点是你只需要为iOS提供其他样式或标记。您可以使用媒体查询或浏览器检测。请在网上查找一些演示，因为作者没有提供明确的文档。例如：stellar.js iOS Paralax演示。还有其他一些例子可用。

跟踪当前滚动位置使用这样的事情：

var page = document.getElementById('page'); 

var scrollTop = isIOS ? 
    -(new WebKitCSSMatrix(getComputedStyle(page).webkitTransform)).m42 : 
    window.scrollY;

消防这里面requestAnimationFrame循环。不幸的是，你不能在这个版本的库中使用WebKitCSSMatrix更优雅的方式获取滚动坐标。但你可以为此做出拉取请求。

希望这会对你有用！

来源

2014-05-06 14:19:25 Dan

非常详细的答案，谢谢！ – Raptor

你可能想用这个：

document.addEventListener("touchmove", touchScrollHandler, false);

来源

2014-01-11 04:01:46 joseeight

你能详细说明一下吗？ 'touchScrollHandler'也没有定义。我的问题是关于jQuery，而不是传统的JavaScript。另外，对于'touchmove'事件，它在桌面浏览器中的表现如何？ – Raptor

对不起，我假设普通的JavaScript没问题，touchScrollHandler是一个你定义的普通函数，会得到一个事件，然后你可以通过检查页面的滚动位置来计算滚动位置。下面是一个jQuery实现，它对你更有意义：http://forrst.com/posts/jQuery_iPad_one_finger_scroll-B30 – joseeight

尝试了''（'body'）。on（'touchmove'）'，它的行为与' scroll（）' – Raptor

手机浏览器中$（window）.scroll事件的触发率

回答

相关问题