移动Web开发的bug及解决方案

我目前移动Web开发遇到的bug以及解决方案（慢慢补充当中）。

1.android4.0以上一部分手机的webview中，当canvas小于屏幕大小时，绘图时会出现重影，就是说一个图只绘制了一遍，却出现了两个。

解决方案： canvas外层的div需要设定属性style="overflow:visible;-webkit-transform: translateZ(0)";

 

2.ios应用里面webview在iPhone6或iPhone6 plus获取的设备宽度（device-width）一直是320，应该要是375、414。

原因：应用没支持iPhone6、iPhone6 plus的分辨率，就延用了iPhone5 S的分辨率

解决方案：

第一种方式是根据官方的推荐创建一个launch screen.xib，然后在launch Screen file下指定这个文件就能支持iPhone6或者iPhone6 plus的分辨率了。

第二种方式是为iPhone6和iPhone6plus添加两张特殊的png

iPhone6：命名：Default-375w-667h@2x.png   分辨率：750*1334

iPhone6 plus 命名：Default-414w-736h@3x.png  分辨率：1242*2208