因为业务需要,为某银行做一个前半部分有业务展示动效,后半部分为砸蛋活动的h5,由于需要用到比较强的互动,所以,就选择ih5这种交互功能比较完善的第三方工具来做。做完之后发现这样的需求应该还是蛮多的,因为这样的h5可以将传统的动效展示和互动性很强的砸蛋抽奖活动完美的结合在一起,这样用户既不会因为全部都是广告而感到反感,也可以参与砸蛋得点小便宜。下面,我就来给大家分享一下制作的过程:

一、设计前面的展示动效,用以宣传业务。

由于是给某银行做的h5展示页,因此加入了一些银行的吉祥物和宣传元素。这部分没有什么特别之处,就不再详细展开,放上一些图片做参考吧。

二、与砸蛋活动的对接

很多人认为这个对接不就是在展示页后面加上活动页不就行了吗?起初,我也是这么认为的,可是,当我真的这样弄好以后,发现问题来了,我所做的没人可以参与一次砸蛋活动的限制失效了。这是什么原因呢?原来是因为由于在活动页前面加入了业务展示页,所以砸蛋页面没有在第一页出现,这样我对砸蛋次数限制所触发的事件就不会在程序启动的时候加载,比如:判断砸蛋是否已经1次,如果已经砸蛋,则隐藏开始砸蛋的按钮、隐藏锤子等,而那个按钮和锤子现在还在后面几页呢,跟本就没有加载,也就不会隐藏,而此时,这个事件已经执行了,那么,真的加载到砸蛋页面的时候就不会隐藏。这样的解释,您听懂了吗?

那么怎么解决呢?我的办法就是通过设置cookie和读取cookie。

在舞台中添加变量1

在限制每天只能砸一次的事件组里面添加事件,讲变量1设置到cookie变量bb中,如下:

然后,在砸蛋页面设置时间为1秒的时间轴

并赋值变量,从cookie中获取bb赋值给变量1

在砸蛋的计数器中绑定变量1,这样就可以跨页面赋值了。

这样,最主要的跨页面传值的问题就解决了,至于砸蛋怎么实现的,ih5的视频教程里面就介绍的非常详细了,这里不在赘述。

发表评论

电子邮件地址不会被公开。 必填项已用*标注