目前可以制作的h5制作工具有很多。一般选择空白模板进行自由设计或选择现有模板进行简单的图形替换，可用于年报、邀请函、企业招聘等h5页面类型。
制作h5页面的工具
如果要求不高，可以使用模板类的h5工具，直接为图片改文字也是可以的。如果想有创意，发
制作全景图的效果并不复杂。我们只需要借助:1的背景素材图，根据需要添加即可。
一、案例效果演示
二、组件结构
全景容器组件:我们简单地将其结构分为三个层次结构:
1.最外面的元素/背景
2.中间层元素/背景
3.最里面的元素(交互元素放置层，缩写为交互层)
最外层元素/背景由全景容器组件的最外层图片元素层组成，在手机上看离我们视线最远；
中间层元素/背景由全景容器组件的中间层中的图片元素层组成。在手机上看，比最外面的背景更接近视线，介于最里层和最外层之间。
最里面的元素，在手机上看，比最外面的背景离视线最近；一般我们用一个图层页面来做这一层，可以在这一层做一些交互的触发设置。
可以使用最外面的背景(2:1)作为全景容器本身的背景，中间的背景(2:1)，也可以直接使用。页面作为全景容器的背景(普通全屏尺寸740x1136分辨率72dpi或者加画布)。
提示:在层间滑动屏幕时，会出现错位的视觉差异效果。做的层数越多，视觉差异效果就越丰富。
三、应用场景
全景容器组件，可以连接长宽比为2:1的图片，以y轴为中轴，旋转360。目前有该组件的案例供大家参考。
《这些声音你听过吗？》
《乌兰察布第二届冰雪艺术节》
三、材料准备
下载文末附件中的素材，不用于商业用途，仅供学习。
1.如果要让最外面的背景可见，中间的背景不能是jpg格式，可以是png格式的图片，有透明区域；另外，大小比例为2:1的jpg格式大图不能放在图层中。
2.相关尺寸规格。默认大背景尺寸比例为2:1(2000x1000px分辨率72dpi)，其他所有小元素在ps中设计完成后逐一导出。注意:png格式的图像被裁剪掉不必要的透明区域。大图尺寸比较大，但是要尽量控制和压缩。
3.在ps等设计软件中完成所有元素或大图。在ps等设计软件中设计排版元素后，逐个导出png或jpg，然后上传到:1)导出为单独的图层，放在中间的背景或者图层图层中，看个人需求。
四、组件教程
基本用法
1.添加全景容器组件:高级组件-交互组件-全景容器。
2.单击panorama容器以添加组件。
3.点击【使用中间背景图片】和【使用外部背景图片】的缩略图，将图片替换为2:1(2000x1000px分辨率72dpi)的大小比例，两个背景图层可以不设置。
4.点击上图中任意一层背景图片，显示素材上传界面，仅支持上传jpg/png格式的图片。
4.双击图层设置直接切换到图层页面添加或修改材质。
5.点击进入图层中的排版效果如图。点击左上角的黑色小三角，切换回页面。
交互式图层设置。用户最关心的问题是在全景容器中设置一些交互设置，一般主要在图层层(最内层)好的。
