H5近两年在海内持续发酵，使得交互（interaction）这一观点从网站设计逐渐延伸到H5上。
就像鱼离不开水，H5离开了交互，便失落去了HTML5措辞所授予页面形态的代价。说白了，如果H5弱化了交互，它充其量只是一个移动页面的滑动PPT，根本谈不上是H5。
“交互功能就像橡皮泥，只要发挥想象，它就能捏成各种形状。”这是iH5.cn某位不愿意露脸的专业设计师原话。只要发挥想象，即便是同一个交互功能，也能延伸出各式各样的戏法。
接下来以H5页面制作工具——iH5.cn为例，选用最常用的韶光轴功能，一步步深入探究它能延伸出的各种戏法。
1.先别急着动手，韶光轴究竟为何物？
如果对韶光轴的观点不清晰，说再多也是空费，我们先来科普一下韶光轴。
如果在初中电脑课上有学过Flash制作小汽车运动的朋友，看到韶光轴的界面时该当会感到很熟习。没错，韶光轴的观点类似于Flash动画制作，通过关键帧掌握工具在规定韶光内的运动轨迹。
想用韶光轴，请务必记住以下操作逻辑顺序：韶光轴——工具——轨迹——关键帧——修正关键帧属性。
那么，韶光轴最常见、最大略粗暴的运用是啥呢？
2.规律性的几何运动
只要打开韶光轴的循环播放功能，它就变成了无限循环的韶光单元，以是我们能用韶光轴延伸出很多规律性的运动形态，打个比方——
（1）线性运动
就比如上面这个奔跑的男人，纯粹是单向线性来回运动，它的事理跟上面提到的用Flash做小汽车运动是一样的，我们只需在韶光轴上，用多个关键帧掌握这个男人的X坐标就能实现了——
说到这里，要跟大家分享一个小技巧。大家把稳到这个男人实在是在做来回运动，提高跟倒退的轨迹是刚好相反的。
因此我们在这类来回运动制作时，只需做好提高的轨迹，然后在韶光轴下插入一个“结束——韶光轴反向播放”的事宜，这样能减少很多工序，又能对称两个运动轨迹。
（2）圆周运动
跟线性运动相似，圆周运动只不过是在关键帧上调度素材的旋转角度，这是换汤不换药的，最常见的运用便是模拟现实生活中的腕表/时钟，让秒针、分针做周而复始的圆周运动。
如果把线性运动跟圆周运动同时放在同一个韶光轴下，那么恭喜你，一个大略粗暴的韶光轴动画完成了——
说到这里，不禁想吐槽一下...为什么圆周运动式的玩法这么独特！
这么好玩！
怎么这么少设计师用？
它明明可以产生很多交互上的化学反应！
无论是预加载的Loading页，还是过渡页，圆周运动式的韶光轴动画都能给用户一种独特的生理预期，比如这种——
希望今后能看到这类韶光轴运用的化学反应吧，咳咳，有点跑偏了，我们连续...
3.不存在规律的运动
实在说不存在规律的运动有点笼统，实在说成仿真式视频效果会比较得当，由于这类每每会让你分不清它到底是韶光轴动画，还是视频。
比如最近iH5.cn上那位专攻韶光轴动画的设计师小牙，他不久前的《门窗都关了,你就给我看这个?》H5——
效果就跟用AE做的动画视频一模一样，特殊是那个全屏振动效果，这完备媲美AE上的wiggle（a，b）振动效果！
只不过，小牙用的只是一个大略的“全屏振动”事宜，就将这个效果复现了。
在这整套韶光轴方案上看，设计师小牙让我们看到了韶光轴的更多可能，用韶光轴模拟动画视频，未尝不是一个很好的运用形式。
韶光轴还能做什么？
4.用韶光轴做高等动效
韶光轴动效的事理和原生的动效组件相似，都是通过在单位韶光内，改变元素的位置、大小、透明度、旋转角度等匆匆成相应的动效效果。
可以是单位韶光内掌握单一属性，也可以是掌握多个属性。
掌握多个属性时，实现的动效效果更为惊艳！
比如——
橡皮糖式滑动效果（掌握高度、Y坐标）
重影效果（掌握透明度、旋转角度）
折半翻转效果（绕X坐标旋转）
视差效果（掌握剪切属性）
360度物体展示（掌握旋转角度、视距）
5.用韶光轴做赞助
韶光轴的灵巧度很高，除了像上面提到的实现各种高大上交互，还可以作为赞助功能利用。此时可以将韶光轴理解成导火线，用来引爆交互这颗重磅炸弹。
那么，它能“引爆”哪些交互？
用韶光轴的循环播放掌握页面自动翻页
韶光轴用事宜连接计数器，做成倒计时
韶光轴用事宜连接动效组件，合营动效的延时触发，让动效的衔接更自然
韶光轴获取当前事宜，制作按下1秒等敏捷类小游戏
当然韶光轴的赞助性运用远不止于此，上面只是抛砖引玉，还有更多有趣&实用的技法，还需靠大家去发掘。
功能就放在那儿，看似是去世的；但只要懂的思考，它就能活起来，乃至能让你的H5作品迸发出更多的光彩。
现在，你能遐想出哪个功能的延伸运用了吗？
