本文详细教学如何制作H5快闪动画 ， 九个步骤打造炫酷H5快闪动画 ， 附H5快闪模板
文章插图
工具/原料电脑
意派Epub360工具
方法/步骤11.打开意派Epub360编辑器 ， 把画布背景调成纯黑色 ， 添加富文本组件 ， 双击编辑文字 ， 输入“接下来的” ， 设置文本样式为黑体 ， 14pt ， 粗体 ， 居中显示；
文章插图
22.复制粘贴出两个文本 ， 更改文字为“时间” ， '你"；
文章插图
33.添加段落组件 ， 输入“准备好了吗？” ， 设置文本样式为黑体 ， 14pt ， 粗体 ， 居左显示；
文章插图
4【如何制作H5快闪动画，就用意派Epub360免费制作】4.给“接下来的”文本添加缩小出现动画 ， 持续时间为0.8s ， 延迟0.5s ， 动画效果为Power4.easeOut ， 初始比例为4 ， 接着给该文本添加渐隐动画 ， 持续时间为0.01s ， 延迟0.3s ， 其他的不做设置；
文章插图
55.给“时间”文本添加渐现动画 ， 持续时间为0.01s ， 勾选等待触发器触发；接着再给该文本添加渐隐动画 ， 持续时间为0.1s ， 延时0.2s ， 勾选等待触发器触发；
文章插图
66.复制“时间”文本动画 ， 粘贴动画给“你”文本上；
文章插图
77.给“准备好了吗？”文本添加逐字出现动画 ， 持续时间为0.5s ， 动画效果为Power4.easeOut ， 勾选等待触发器触发 ， 接着再给该文本添加渐隐动画 ， 设置持续时间为0.1s ， 延迟0.2s ， 勾选等待触发器触发；
文章插图
88.设置“接下来的”文本渐隐开始时 ， 播放“时间”文本添加渐现动画 ， “时间”文本渐现动画结束后播放“时间”文本渐隐动画 ， 后面以此类推 ， 总的来说 ， 下一个出现（渐现）动画与上一个消失（渐隐）动画一起开始 。
文章插图
99.最后把所有文本x ， y轴位置调整对齐 ， 预览看看吧~
当然啦 ， 方法页不唯一 ， 也可以不使用触发器衔接动画的出现与消失 ， 渐隐的动画也可以用隐藏元素来代替 ， 步骤做起来感觉很简单的 ， 祝你们成功！
文章插图
以上内容就是如何制作H5快闪动画 ， 就用意派Epub360免费制作的内容啦 ， 希望对你有所帮助哦！
推荐阅读
- 如何在红油添香发表诗歌
- 怎么做一把玩具枪 如何自制玩具枪
- 如何在网上交宽带费用
- 如何用html5插入背景图片
- 京东店铺如何开通京东电子单服务
- 如何查看自己有没有被微信好友删除
- phpcms v9分页标签的调用，如何实现v9列表分页
- 云梦四时歌如何举报好友头像
- 自制小葫芦工艺品 葫芦工艺品的制作方法
- 苹果Apple Watch如何重新配对