如何在iOS上的Safari中滚动时监视滚动位置?

我目前使用$(window).bind('scroll', foo); 监视$(window).scrollTop()并做些东西来创建视差效果。

在所有的桌面浏览器中,用户滚动的每个像素都会调用foo(),并且所有内容都很漂亮和华丽。 在iOS上的Safari上,滚动事件仅在滚动完成后才会触发。

我添加了$(window).bind('touchmove', foo); 以确保在iOS中的滑动过程中调用该函数,并且让我进一步了一点。 当用户释放手指时,页面继续滚动,但事件停止发射。

有任何想法吗?


当我看到你的问题时,我打算为此做一个polyfill(如果不存在?)。 不幸的是,我的时间很少。

这个想法是有一个setInterval ,它是ontouchstart启动的,它会检查document.body.scrollTop是否自上次更改后,例如。 每20毫秒。 如果是,那么我们手动调度滚动事件。 否则,我们clearInterval因为显然没有更多的滚动发生。

这将是简短的。 如果你有更多的时间(比我),那么随时尝试这些指导方针。

编辑:现在,进一步阅读,似乎在另一个答案上提出了同样的想法。 你确定在iPad上滚动时停止间隔吗?


我强烈建议使用“Skrollr”JavaScript库。 这是迄今为止我发现的最好的移动滚动动画选项,并且很容易快速启动和运行。 根据开始和结束滚动位置创建动画并操作CSS。 为大多数标准CSS属性创建尽可能多的数据滚动位置和动画。

在下面的例子中,背景颜色会在500像素滚动的过程中生成动画:

<div data-0="background-color:rgb(0,0,255);" data-500="background-color:rgb(255,0,0);">WOOOT</div>

在Git上签出仓库:https://github.com/Prinzhorn/skrollr

Skrollr演示范例:http://prinzhorn.github.io/skrollr/

真棒世界的例子:http://www.fontwalk.de/03/


苹果iPhone 5c的网页使用了一些视差滚动效果,这种效果似乎会继续,手指仍然会触摸屏幕并进行滚动。 所以我想JavaScript在滚动期间不能完全禁用。 Tumult Hype也提供这种功能。

链接地址: http://www.djcxy.com/p/95619.html

上一篇: How can I monitor scroll position while scrolling in Safari on iOS?

下一篇: Julia syntax highlighting in julia