H5页面,左右滑动切换网页是怎么弄的呢?

我是个养鸡的,稀里糊涂的学了编程,想问问左右滑动切换网站是怎么实现的呢?

就是往左一划,从页面1 成了页面0,

这个过程一般是用ajax改变了<body>的内容,还是重新加载了一次网页?

如果是重新加载了一次内容,是用的 window.location="" 还是有别的呢?

阅读 9.6k
4 个回答

方法很多

  1. ajax 请求了数据以后,存在变量里面,然后监听了需要滑动的 dom 元素, 滑动就根据变量更新 dom 元素即可
  2. iframe,加载好页面,然后用 和上面一样,监听到滑动,改个 iframe
  3. 写死在页面上, 直接操作 dom 滑动

至于动画的话大体有两个方案

  1. css transition
  2. js 动画

至于路由啊mvvm本质上只是减少了重复劳动而已,通过其他的类库减少如上监听 控制 dom元素代码量,提高可维护性

clipboard.png
哥,你怎么这么想不开。要来学编程。

首先,滑动无非是监听事件对滑动距离速度等进行判断。
至于是ajax还是重新加载页面,都是可行的做法。一方面可是mvvm(vue,react等)单页,一方面可以类似回退那种功能。
重新加载一次,还是看需求,如果是单页是不需要操作window.location的。当然也可以这么做,不能算有问题。

有很多方法可以实现,在这里给你随便举几个例子。
1:以选项卡的方式实现,说白了就是显示隐藏,再加上一些动画就可以实现
2:以路由方式监控,替换局部页面,现在大多数单页面框架都是以这种方式实现的

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题