angularjs路由转换如何以交互方式进行动画处理？

Question

我知道如何在路线之间制作动画，但是如何制作这些动画＆＃34;互动＆＃34;？例如，我希望动画直接映射到用户的拖动手势，而不是简单地在滑动时触发预设的幻灯片动画。此类交互的另一个副作用是用户应该能够开始转换，但然后使用相同的手势取消它。

这种模式对于构建Google的Material Design中的动画过渡非常重要。我可以在路线中完成这些过渡，但出于组织原因，我希望能够在路线之间完成这些过渡。

非常感谢任何设计的例子或描述。

Answer 1

我会这样做：

1. 检测touchstart事件和触发行为
2. 移动时检测手指位置，并相应地移动包装html元素。可能与css一样，如transform3d：translateX（...）
3. on touchend，评估距离是否足以触发路线更改
4. 如果没有，请使用css过渡动画回原始位置。

您可能希望查看http://hammerjs.github.io/进行手势检测。

祝你好运！