iH5基础教程为H5添加事件动效.docx
- 文档编号:13984405
- 上传时间:2023-06-19
- 格式:DOCX
- 页数:11
- 大小:812KB
iH5基础教程为H5添加事件动效.docx
《iH5基础教程为H5添加事件动效.docx》由会员分享,可在线阅读,更多相关《iH5基础教程为H5添加事件动效.docx(11页珍藏版)》请在冰点文库上搜索。
iH5基础教程为H5添加事件动效
iH5基础教程:
为H5添加事件、动效
第一步:
1、在对象树选中舞台
2、点击工具栏的页面工具
,添加两个页面
3、页面1背景颜色设置为黑色。
第二步:
1、页面1里添加木牌,发光罐子和罐子三张图片。
2、隐藏发光罐子,即隐藏对象树发光罐子前面的勾,之后设置事件使其显示。
3、在对象树里选中页面1,点击中文字体工具
,添加中文字体“点击魔法罐”、“释放爱的魔力”。
4、选中中文字体,点击工具栏添加动效
。
两个中文字体要依次出现,所以第一个中文字体的动效触发后延时0秒,第二个中文字体的动效触发后延时1秒。
4、选中木牌,点击工具栏动效工具
,自动播放NO,开始前隐藏YES,之后用事件触发它播放。
第三步:
1、选中罐子图片,点击工具栏事件工具
,点击罐子,发光图片显示,木牌动效开始。
2、选中木牌,添加事件,点击木牌,目标对象舞台,目标动作跳转页面2。
第四步:
1、选中页面2,点击工具栏透明按钮工具
,在舞台上拉出一个框,调整属性面板x坐标0,y坐标0,
3、透明按钮下添加背景图片
4、选中页面2,点击工具栏时间轴工具
,选中时间轴,点击工具栏图片工具
,添加4张流星图片,选中图片,点击工具栏轨迹工具
,添加关键帧控制流星的运动。
第五步:
1、选中页面2,点击图片工具
,添加一个查看详情的图片。
2、选中图片,点击工具栏的动效
和事件工具
,事件触发条件手指按下,目标对象舞台,目标动作打开网页,资源位置处输入一个网址。
注意手机案例触发条件应使用手指按下。
重点控件:
事件、中文字体、动效
其他相关控件:
页面、图片、时间轴
知识点:
触发后延时是指缓动在被触发执行以后,会在设定的延时时间以后播放,单位是秒。
两个中文字体先后出现,可以用触发后延时来控制,动效1的触发后延时为0,动效2的触发后延时为1。
重点事件:
1、触发图片显示:
触发对象:
罐子,
触发条件:
点击,
目标对象:
发光罐子,
目标动作:
显示。
2、触发动效开始:
触发对象:
罐子,
触发条件:
点击,
目标对象:
木牌动效,
目标动作:
开始。
3、跳转页面:
触发对象:
木牌,
触发条件:
点击,
目标对象:
舞台,
目标动作:
跳转页面。
选择一个页面。
4、打开网页:
触发对象:
查看详情,
触发条件:
点击,
目标对象:
舞台,
目标动作:
打开网页。
资源位置处填写一个网址。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- iH5 基础教程 H5 添加 事件