zl程序教程

您现在的位置是:首页 >  其他

当前栏目

uniapp - 实现 H5 网站项目路由跳转页面时增加动画效果,给手机移动端网页的所有页面加入跳页动画效果(直接引入核心方法即可全局生效,无需每页都引入,引入一次即可,高效简洁无 BUG)详细解决

2023-09-11 14:15:54 时间

前言

在 uniapp 项目中,只有 App 平台才有页面跳转时的动画,那么 H5 网页怎么实现呢?

本文实现了 在 uniapp H5 项目中,路由跳转时给整个项目的 “全部页面” 加入动画效果,支持自定义动画和时间,

您可以直接复制本文提供的方法,按照示例代码引入即可,想改动画、时间自行更改即可。


如下图所示(Gif 图有些卡顿,实际上很流畅),大白话说就是只要你路由变化(所有路由 API)了,都会执行动画:

示例代码干净整洁,超详细的注释

在这里插入图片描述

第一步

首先就是先引入本文提供的源码,推荐一键复制功能避免漏选。

c