如何让整个web页面滑动切换

 我来答
联雅网络
推荐于2018-08-28 · 百度认证:深圳联雅网络科技有限公司
联雅网络
联雅网络成立于2005年,是一家技术开发型的网络公司,致力于高端品牌网站建设,微信公众平台开发,是一支拥有一百多人的网站设计技术团队。分深圳联雅网络与广州联雅网络,一直专注网站建设领域
向TA提问
展开全部

让整个web页面滑动切换方法如下:

解决办法其实很简单,采用AJAX刷新、CSS切换。这里还需要注意的是,只有在WebKit浏览器上能看到效果。(用PhoneGap做了一个测试应用,可以在Android和IOS系统上运行,所以只需要WebKit的兼容性。)

1、首先,看看对body标签的css样式,让它有动画效果:

2、接下来,给超链接添加点击事件,让它产生切换效果。

3、下一步是使用AJAX获取到链接页面

4、要达到切换效果,还需要以下步骤:

a. 滑动当前页面到屏幕左侧;

b. 瞬间移动当前页面到屏幕右侧;

c. 替换body里面的内容;

d. 从屏幕右侧滑入当前页面对。

5、必须要遵循上面的步骤,不然不能达到预期的效果。

现在说一下详细步骤:

a.移动body到屏幕的左侧

b.写个移动监听事件

c.切换过程中,用户可能会点击后退按钮,还需对此进行处理:

总结:基本的思路就这些,当然在实际操作过程中还有一些细节需要注意,这里就不详细说了,都在代码里能体现出来

落允玦E9
2021-03-20 · 超过30用户采纳过TA的回答
知道答主
回答量:136
采纳率:88%
帮助的人:21.7万
展开全部

活动作品如何在一个网页实现登录_注册表单切换?14分钟带你使用CSS+JS实现炫酷滑动切换效果

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式