微信H页面制作简易教程培训课件
- 格式:pptx
- 大小:2.30 MB
- 文档页数:36


Epub360支持设定元素的运动轨迹,有些简单的通过飞入飞出就可以完成,但是要绘制比较复杂的直线或者曲线运动要怎么办呢?一、直线运动的设置1.页面中添加一个元素,并选中它,找到右侧的属性面板中的动画面板,找到直线运动,并点击“+”号添加,如图:2.一般在添加直线运动后,会弹出直线运动编辑面板;如果不小心关掉了,我们可以在直线运动动画的右侧找到编辑符号“”点击即可再次进入。
3.切记,在弹出直线运动动画编辑面板的状态下,去双击元素(小球),才可以正常画直线,并弹出画线提示。
详细的操作动图如下:曲线运动案例展示:媒体邀请函曲线运动的设置跟直线运动的设置基本一致,区别是画曲线运动路径时,运动路径会自动生成拐角的弧形。
1.将元素添加到页面中,并跟上面添加直线运动的方式一样,添加曲线运动。
2.同样是在弹出曲线运动动画编辑面板时,去双击元素来画曲线运动的路径。
快捷键:1.ESC退出编辑2.C绘制闭合路径4.O取消轨迹闭合3.Shift+鼠标左键删除轨迹点4.Alt(Option)+鼠标左键添加轨迹点意派Epub360-专业H5设计工具意派Coolsite360-专业响应式网站/微信小程序设计工具Q&A:Q:我已经画了运动轨迹,要想修改双击怎么是替换图片资源?A:1.先确认下自己使用的必须是浏览器,没有的话官网教程页面有下载链接。
2.要先在右侧动画面板单击后才进入曲线绘制界面,此时才可以对曲线路径进行修改。
Q:勾选跟随路径旋转结果会颠倒过来怎么办?A:这个解决方法也简单的,只需要将图片素材旋转180°就可以了。
看图:Q:如果我想要一个跳跳停停的曲线动画怎么办?A:只要多画几个就可以了。
接续的动画会以上一个动画的结束位置开始运动的。
带大家写一个手机端页面H5APP(适合新手)第一节大家好,我是新媒之声工作室的大白,今天给大家带大家写一个手机端的页面,这里我们是使用的H5+APP开发的,用的是HBuilder 软件,这个软件很适合新手有较强的自动补全功能。
这里我就不介绍这个软件了,大家可以自己摸索。
我们要准备的工具有:HBuilder(开发软件),jquery。
首先我们打开软件HBuilder,点击左上角文件→新建→移动app,进入新建页面,我们需要填写应用名称和应用储存的目录和所需的框架,这里我们不用mui框架,选择空模板→点击完成。
我们新建完移动app就可以在左边的项目管理中看见。
我点刚刚新建的移动app可以看见软件已经为我们自动生成了所需要的文件夹及文件,css文件夹用来放入我们写的css样式,img文件夹是用来放置我们所需的图片,js文件夹使用来放置我们编写的js 文件或是jquery,index.html文件是我们移动app的主页,manifest.json文件是用来设置移动app的应用介绍图标及其设置的文件。
接下来我们右键css文件夹,选择新建→css文件,进入新建css 文件页面,填写css名称,其它默认就可。
然后我们右键js文件夹打开文件所在目录,把准备好的jquery复制进去即可。
我们双击index.html文件,进入index.html文件编辑页面,就可以看到软件替我们提前写好的标准H5+结构,这里我就不在介绍H5语言结构了,不知道的可以看前面的教程但我们介绍会解释这句话这句的意思就是不允许用户自己手动缩放或扩大页面比例和自动设置缩放比例,这里好像是1:1的比例。
软件保存快捷键和其它软件一样Ctrl+S,另存为快捷键为Ctrl+Shift+S。
谢谢观看,下一节开始讲解移动app的主页设计。