ih5动效工具如何做跳一跳效果

 时间:2026-02-11 21:43:47

1、1.如图所示,我们选择“跳一跳”这个页面,之后点击“SVG”这个按钮上,就

可以看到很多图形了,我们可以选择一个跳一跳的对象,让这个对象来跳。

ih5动效工具如何做跳一跳效果

2、2.如图所示,我们选择一个这样的图形来作为跳一跳的对象,之后放到页面上就

可以了。

ih5动效工具如何做跳一跳效果

3、3.如图所示,我们画上这一片区域,来放置跳一跳的对象。

ih5动效工具如何做跳一跳效果

4、4.如图所示,我们选择这个跳一跳的对象之后,点击如图所示的“动效”按钮,

在里面选择跳一跳的动效动作。

ih5动效工具如何做跳一跳效果

5、5.如图所示,我们点击箭头所示的“弹跳”这个动效,为这个对象添加上这个动

效。

ih5动效工具如何做跳一跳效果

6、6.如图所示,我们点击选择跳一跳这个页面,之后点击箭头所指的文本工具,为

这个页面添加一个文本,用来做点击事件,让跳一跳对象来跳。

ih5动效工具如何做跳一跳效果

7、7.如图所示,我们为这个文本画一个合适的区域,之后鼠标点击就可以确定区域

了。

ih5动效工具如何做跳一跳效果

8、8.如图所示,我们调节这个文本的文字大小、颜色还有边框等。

ih5动效工具如何做跳一跳效果

9、9.如图所示,我们选择这个“跳一跳”的文本上,之后为这个文本添加一个点击

事件。

ih5动效工具如何做跳一跳效果

10、10.如图所示,我们先点击这个实心三角,在弹出的下拉列表菜单中,我们选择

“点击”这项。

ih5动效工具如何做跳一跳效果

11、11.如图所示,我们点击这个实心三角,在弹出的下拉列表菜单中,我们选择“

弹跳”这项,让点击之后弹跳发生动效。

ih5动效工具如何做跳一跳效果

12、12.如图所示,我们点击这个实心三角,在弹出的下拉列表菜单中,我们选择“

播放”这项,让这个弹跳发生。

ih5动效工具如何做跳一跳效果

13、13.如图所示,我们点击选择“预览”,来观看这个ih5的案例。

ih5动效工具如何做跳一跳效果

14、14.如图所示,我们看到代码编译完成之后,我们点击箭头所指的“确定”按钮

,就可以预览这个案例了。

ih5动效工具如何做跳一跳效果

15、15.如图所示,我们点击下面的跳一跳文字,就可以看到上面的小人图案跳动啦

ih5动效工具如何做跳一跳效果

ih5动效工具如何做跳一跳效果

  • iH5中级教程:活动必备,距离XX还剩X天X时X分
  • iH5中级教程:微场景H5必备,掌握轻触效果
  • ih5如何设置物体运动
  • iH5高级教程:H5交互菜单,流动的按钮特效
  • ih5怎样在场景中添加操作提示
  • 热门搜索
    以读书为主题的手抄报 关于春节的手抄报大全 勤俭廉政手抄报内容 五一手抄报资料 清明节手抄报图片简单 关于三月三的手抄报 争当美德少年手抄报 关于马的手抄报图片 国庆70周年手抄报内容 英语国庆节手抄报内容