如何在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?