上一张图,表达此时内心的心情
正文开始:
客户需求:
点击关注按钮展示弹层,弹层展示二维码,长按二维码关注。
问题情况:
把功能做上去以后做测试的时候发现安卓下可以正常识别,但是IOS却毫无反应。百度了一万年没有找到解决方案。其实是有解决方案的,只是网上的解决办法说得太死。
终于发现问题:
百度搜索结果中有一种说法,大概意思是:长按识别二维码的时候,微信对二维码的识别位置有偏差,于是对着整个页面弹层的位置(需求是做到弹层上的)挨个长按,最终发现识别区域位于二维码图片右下方,大概半个图片大小的位置(不精确)。
解决办法:
1. 给二维码图片的父层div加一个背景图,此图就是二维码图片;
2. 把二维码img相对定位(position:relative;),往左上角移动,left跟top值需要慢慢调,确保父层div背景图的四个角都能识别二维码;
3. 二维码img设置opacity:0;隐藏;
ps: 这里可能需要做iphone plus的媒体查询兼容:@media (-webkit-device-pixel-ratio:3);