页面切换 CSS3 上的过渡动画

Question

我想到了与我的新网站有关的一件很酷的事情，即在我的页面之间进行滑动过渡。我四处搜索并找到了像 angular.js 和许多其他类似的解决方案，但是这些解决方案似乎只适用于单页使用。由于我有更多我想知道是否有任何好的和流畅的方法来实现两个页面之间的过渡动​​画？

因此，基本上，当前页面应该有一个动画，它根据加载下一页时下一页在水平菜单中的位置向左或向右移动页面。当目标页面完成加载后，它将显示该页面的动画，该页面从与前一页面消失的相反方向滑入。

这可能吗？

Answer 1

如果您可以控制页面中的所有链接，而不是使用硬编码链接，请将导航委托给单击事件。在这种情况下，您首先要播放滑出动画，然后才能真正导航到目标页面。

您可以将进入动画的方向作为参数传递给目标页面url。默认情况下，目标页面的内容应该是不可见的，然后根据动画方向参数，在页面加载后将内容滑回。