我用skrollr为iOS做了一个视差网站。我想以编程方式向下滚动到页面上的某个点。我使用过jquery滚动插件,它们可以在台式机上运行,但不能在移动端运行。如何使用jQuery模拟向上滑动或以某种方式模拟滚动到另一个点?谢谢!
编辑:这不起作用的原因是,在移动设备上,由于iOS在滚动过程中停止动画,skrollr实际上不会滚动。相反,它监听触摸事件并移动元素。这就是scrollTo插件不能工作的原因。(来源:https://github.com/Prinzhorn/skrollr#mobile-support)
发布于 2013-11-13 02:20:17
实际上,我刚刚意识到skrollr API已经内置了这一点!
我可以使用skrollr作为初始化skrollr的变量来调用skrollr.animateTo(400)
。
希望这对其他人有帮助!
发布于 2015-08-05 22:10:21
这更像是一个FYI。
我发现使用skrollr在手机上实现自动滚动功能的优缺点是这样的:
我在touch eventsjQuery手机上使用了两个库,我最终还是坚持使用hammer,因为我更喜欢它的文档。
我在ipad上使用它的方式很简单。我做到了,如果你点击并按住右边的屏幕,它会自动向下滚动,直到你松开为止。反之亦然。
我的问题是,它将无法读取释放事件并保持滚动,并且用户无法停止它。
在摆弄了一下之后,我决定改变它。我所做的是放置两个用户可以点击的按钮,它会自动滚动到我整个skrollr动画的下一个部分。
这是我写的代码的一个例子。
var ai = 0;
var positionArray = [0, 1244,3194,15468]
$(function () {
var rightArrow = document.getElementById('right-arrow')
var mcRight = new Hammer(rightArrow);
mcRight.on("tap", function (ev) {
ai++
s.animateTo(positionArray[ai])
//alert(s.getScrollTop())
});
var leftArrow = document.getElementById('left-arrow')
var mcLeft = new Hammer(leftArrow);
mcLeft.on("tap", function (ev) {
ai--
s.animateTo(positionArray[ai])
});
})
希望这能有所帮助。我想以我原来的方式使用tap & hold,但这两个插件在读取滚动的taphold释放事件时都有问题。
另一个问题,但通过查看文档非常容易解决的是,无论您的动画部分的长度有多长,都需要1秒才能到达。如果它是一个很小的部分是很好的,但如果你有一个很长的部分,它会非常快地擦过它。
https://stackoverflow.com/questions/19936739
复制相似问题