我最近对微信(威信)前端框架之一的有趣行为感到好奇。
如果你看https://weui.io/使用打开的 Chrome 设备工具栏，然后在第一页的列表中选择一个元素 - 您会注意到它会将您带到新页面，而无需重新加载任何页面 + 新页面类型从右向左滑入。
但最有趣的部分是，如果您按“后退”按钮(Chrome 浏览器窗口左上角的常用“后退”按钮)，它将带您返回首页。另外，如果您使用移动设备打开相同的 weui.io，您将能够选择列表中的某些元素，它将再次加载带有漂亮幻灯片效果的新页面，然后您只需从左向右滑动即可返回上一页。所以滑动的工作方式完全就像在应用程序中一样，我觉得非常有趣!
我想在我的网站上构建相同的行为，但无法有效地模拟它。
我的想法是，我只是立即加载两个页面，第二个隐藏，然后根据需要滚动第二个页面，但重点是我需要在整个站点范围内使用此方法，而这种方法对于整个站点范围来说非常笨拙使用。或者，我可以使用 AJAX 加载第二页，但它仍然不会在移动设备上提供滑动效果。
我一直在检查代码，但仍然无法获取涵盖该特定函数的代码部分。
有人做过类似分享exp的事情吗？感谢您的任何想法!
最佳答案
结果很简单:这都是关于 History API(pushstate + popstate - 还有一个很好的 CSS 技巧 example 作为开始)。
无论如何，History API 可以帮助您模拟后退/前进按钮的行为，即使您只是这样做。
$('.some_div').hide()
$('.some_other_div').show();
我找到了this post真正有用 - 几乎开箱即用。
最后，历史API浏览器支持可以找到here .
如果有任何问题，我很乐意发表评论；)
关于javascript - 模拟类似应用程序的滑动来切换移动网站上的页面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46763348/