-
课程介绍
-
课程介绍 ( 00:04:45 )
-
需求分析与技术选型 ( 00:06:08 )
-
-
基础页面搭建
-
页面结构分析 ( 00:08:34 )
-
图片预加载与loading页面搭建 ( 00:07:12 )
-
首页场景搭建 ( 00:08:09 )
-
首页场景动画 ( 00:06:12 )
-
-
背景“水平斜切和空间垂直切换”效果制作
-
Pixi.js 基本介绍 ( 00:03:40 )
-
创建页面初始化函数 ( 00:10:14 )
-
-
使用 Tween.js 制作页面缓动效果
-
Tween.js 基本介绍 ( 00:05:27 )
-
页面基本动画 ( 00:07:55 )
-
庭院场景动画 ( 00:13:55 )
-
其他场景动画禅师 ( 00:07:54 )
-
-
答题提示音与海报展示
-
答题动画效果分析 ( 00:03:54 )
-
答题判断 ( 00:07:28 )
-
创建题目选择函数 ( 00:11:50 )
-
添加音频素材 ( 00:02:33 )
-
图片合成介绍 ( 00:02:58 )
-
创建图片合成函数(1) ( 00:07:01 )
-
创建图片合成函数(2) ( 00:07:34 )
-
-
课程总结
-
课程总结 ( 00:04:40 )
-
【问答类】H5项目实战:春天飞花令(技术代码部分PixiJS)
中级JavaScript
共计20节课
时长2:18:03
课程介绍
本课程使用 Pixi.js 2D 渲染引擎和 Tween.js 动画库,配合Vue.js,搭建了一个答题类的 H5项目。项目使用背景斜切和空间垂直切换来完成题目场景的切换,涵盖题目动态切换、答案搜集、音频反馈、合成结果海报等多方面内容。
课程目录