1 / 10
文档名称:

H5页面设计初级案例教程:添加图片、设置动效.docx

格式:docx   大小:2,910KB   页数:10页
下载后只包含 1 个 DOCX 格式的文档,没有任何的图纸或源代码,查看文件列表

如果您已付费下载过本站文档,您可以点这里二次下载

分享

预览

H5页面设计初级案例教程:添加图片、设置动效.docx

上传人:文库旗舰店 2020/3/30 文件大小:2.84 MB

下载得到文件列表

H5页面设计初级案例教程:添加图片、设置动效.docx

文档介绍

文档介绍:添加图片素材点击菜单栏的图片组件按钮出现素材库的页面,这两个都是上传素材的按钮,点击图中任意一个按钮即可;点击上传素材窗口的灰色区域,在弹出来的窗口上,打开我们已解压素材的第一页的文件夹,选中里面所有的素材,点击打开;等待素材上传后,点击完成按钮(上传成功素材的右上角会出现绿色的对勾);第一页的图片素材就已上传到我们的素材库里了,把鼠标放到素材上,出现两个按钮,点击右侧的按钮插入图片;图片素材已经插入到了画布上;布局调整拖动图片素材,使背景图片与白色画布完全重合;按照背景图片的插入方式,我们再把第一页的其他图片素材插入,并拖动到合适的位置上添加动效选中图片素材,在右侧的设置面板中选择出现动效,在倒三角状的下拉菜单里找到放大动效,点击选中;同样的,我们依次给另外两张图片添加“向右下旋转进入”和“X轴向内翻转”动效;调整动效播放次序我们想让标题、地图、文字依次按顺序出现,所以设置标题动效延迟0秒,地图动效延迟1秒,文字动效延迟2秒;预览当前页效果点击左上角的预览按钮,选择预览当前页,查看预览页面的效果,预览结束后点关闭按钮,另外也可以通过扫描图中二维码预览所有效果;意派Epub360-专业H5设计工具意派Coolsite360-专业响应式网站/微信小程序设计工具