雷克萨斯：新雷克萨斯IS 平行世界

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

案例：新雷克萨斯IS 平行世界

出品：雷克萨斯

亮点：

策划上，横屏类，新雷克萨斯IS 平行世界强悍来袭，① 倾斜手机选择“动”或“型”，进入不同的样式的展示，最后插入需要用户点击触发的视频；② 还可在尾页点击相应按钮进行资料填写，获得抽奖与试驾的机会；③ 点击首页右下角按钮可以直接跳过H5内容到达用户信息提交页，左下角是“活动说明”。
设计上，商务风，采用蓝绿色作为主色调，色彩较冷，比较沉稳大气，进入“动”或“型”的样式页是一张横向的长图样式。
技术上，倾斜手机选择“动”或“型”采用的是html5的重力感应，里面的动画主要采用的是CSS3的animation，尾屏的视频采用的是Html5的Video。

技术实现： jQuery + SoundJS + Parallax.js（JS视觉差特效引擎）

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

识别图中二维码

新雷克萨斯IS 平行世界-查阅二维码

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

标签