HTML 如何在页面之间转换答案

【问题标题】：HTML How to Transition Between PagesHTML 如何在页面之间转换
【发布时间】：2017-02-09 19:38:13
【问题描述】：

我目前正在尝试在网站上的页面之间进行转换。

例如：如果用户在 www.example.com/About 上并单击链接以转到 www.example.com/Contact，则 about 页面将飞向左侧，而联系页面将飞向左侧从右边进来。

到目前为止，我在网上只能找到如何在带有主题标签的同一页面上执行此操作。但我想用单独的页面来做到这一点。

有可能吗？
如果没有，是否有替代方法以及如何做？

更新

好的，所以我做了更多的研究，我发现这个名为 barba.js(http://barbajs.org) 的东西似乎可以满足我的需求。所以我按照网站上的说明安装了js脚本文件......但它没有用！它所做的只是没有正确加载我的页面，也没有做它应该做的事情。任何人都知道我可以如何使用它（或者是否有比 barba.js 更好的选择）。

-谢谢！

【问题讨论】：

任何事情都是可能的，难吗？是的。您是否尝试过我们可以帮助您的任何事情？没有。
您应该使用AJAX将当前页面的<body>标签内的代码重新加载到下一页的代码中。

标签： html

【解决方案1】：

我认为您不能使用纯 html 和 js 来做到这一点，因为每次单击链接时，如果它不是锚点，您就会加载整个页面。

但是您可以只加载页面的一部分，因此可以使用 Ajax 和 js 应用您选择的转换

但最终，您不会真正从一个页面切换到另一个页面，而只会加载您想要更新的部分。这大概就是 Angular、React 等现代前端框架的工作方式

这里是纯js例子http://www.w3schools.com/js/tryit.asp?filename=tryjs_ajax_first

这是一个 jQuery 示例 http://www.w3schools.com/jquery/ajax_ajax.asp

【讨论】：

感谢您的回答。我只是在努力让它与我的 HTML 一起工作（我对 java 很陌生！）。我如何实现您与转换关联的代码？
我认为像transition 这样的简单css规则应该可以做到，如果你将它应用到你的身体上

【解决方案2】：

您所说的是页面转换，它通常发生在没有硬刷新的 SPA（单页应用程序）中。

如果您不在 SPA 应用程序中工作，我认为您无法通过单击链接/按钮从一个页面移动到另一个页面并发生硬刷新。

您可以选择 jvascript 中著名的 spa/mvc 框架之一的 angularjs 和我们的 ui-router 从一个页面移动到另一个页面。还有很多其他的你可以探索。

【讨论】：