Zerlinda's Blog

自适应微信h5分享页面

最近写微信H5页面比较多,因为写的都比较杂,所以涉及的方面也比较多。所以就不一一拿出来分享了。上个星期算是完完全全自己一个人写了个h5分享页面,要说兼容多移动设备,还算可以,也能够做到页面自适应。基本上简单的一个脚本搞定了所有的根元素rem的转换,但是比起大公司那些成熟的解决方案还是有些许不足…如果仔细在手机端查看的话或许能够看出其中的端倪,这里就不拆穿了哈哈。

对于移动设备的适配,可以参考使用Flexible实现手淘H5页面的终端适配。这是淘宝比较成熟的解决方案,感兴趣可以深入研究一下。

这里的页面是一个简单的分享页面,类似于现在各种会员卡分享之类。输入手机号即可参与该活动。本来点击按钮之后触发相应的ajax操作,因为个人没写后台,所以通通把后台交互的部分去掉。只简单保留了cookie。这一点,你可以在实际查看中体会到这一点。

视觉稿

视觉稿始终按照750px设计,最终还原效果可以在手机端查看。点击此处查看

也可以扫描以下二维码在手机端查看:

 

 

二维码

发表评论

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