可口可乐：端午大片正在热映

2016-07-06 H5案例分享 H5案例分享

案例：端午大片正在热映

出品：可口可乐

亮点：

策划上，游戏类，选择心仪大片，有三个影片可供选择，《肉粽正传》、《疯狂水果粽》、《豆沙粽格格》;① 如果你选的是《肉粽正传》，请点击收集不断落下的粽子，集满十个，即可跳转到尾页，得到可口可乐端午节祝福；②如果你选的是《疯狂水果粽》，请追逐光线，点点小太阳，收集能量，集满能量，即可跳转到尾页，得到可口可乐端午节祝福；③如果你选的是《豆沙粽格格》，请选择包粽子的正确顺序，选择正确即可跳转到尾页，得到可口可乐端午节祝福，选择错误可继续选择；
设计上，漫画风格，这是集角色选择、点击游戏和测试答题于一身的H5游戏，采用可口可乐的红色作为主色调，粽子的绿色作为辅色调
技术上，动画主要采用图片依次显隐，图片显隐主要通过js控制图片的opacity透明度达到显隐效果

技术实现： jQuery

案例演示，请长按/扫描以下二维码 ->

识别图中二维码

端午大片正在热映-查阅二维码

以上为“H5案例分享”团队原创文章，转载请注明出处！

标签