使用Javascript模拟iOS在选项卡之间滚动

我试图找到一种方法或插件，可以在iOS应用程序中复制这种效果，你可以从左边或右边滑动，如果你在那个方向滑动得足够多，当你抬起手指时，它会锁定在下一个窗格上

如何让它知道你什么时候滚动足够多，然后设置新的位置来聚焦？有没有一个好的jQuery插件可以用于这类事情？jQuery Mobile似乎没有这种功能

---

我心目中的布局就像4-5个DIV，在一个DIV的内侧相邻，可能会将overscroll设置为hidden。然后，当您开始滑到下一个窗格时，它可能会触发一个事件，该事件会改变左/右CSS位置并产生一些过渡效果，然后还会更新选项卡以显示新窗格已被选中。

您应该使用touchstart/mousedown，用于此目的的touchmove/mousemove和touchend/mouseup事件支持触摸和桌面设备

• 在touchstart上使用JQueryEventType对象存储初始的X和Y坐标，并设置一些参数来表示有效的刷卡（假设init=true）
• 在touchmove上，首先检查它是否是有效的刷卡（如果init==true）， 然后再次使用JQueryEventType对象获取新的X和Y 光标/手指的位置

现在是棘手的部分：使用这些新的X和Y位置来计算位移和方向。使用这些值设置DIV的偏移量或使用css3.0 translate（x，y）

例如，如果δX>10（一些用于过滤错误的阈值）和δY~0，则其移动到右侧。我将通过delta X将所有div向右平移

我建议不要使用任何动画，因为它看起来不符合你的需要。加上保持过渡延迟非常短，可能没有计时功能。这将在运动时提供一些清晰的反应

---

对于何时假设“滑动足够”的问题，我猜您必须选择常量值或使用屏幕宽度计算。如果增量X或增量Y不小于阈值保持值。。。反弹如果大于此值…向前反弹。

这是一个很好的答案。我还发现了一个名为TouchWipe的插件。节省了一点繁重的工作：