移动端bug整理，随时更新

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica; color: #454545 }
p.p2 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "PingFang SC"; color: #454545 }
p.p3 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica; color: #454545; min-height: 14.0px }
span.s1 { font: 12.0px "PingFang SC" }
span.s2 { font: 12.0px Helvetica }
p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica; color: #454545 }
p.p2 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "PingFang SC"; color: #454545 }
p.p3 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica; color: #454545; min-height: 14.0px }
span.s1 { font: 12.0px "PingFang SC" }
span.s2 { font: 12.0px Helvetica }

1.ie9 不支持rgba支持rgb

2.安卓不支持 audio和video的自动播放，需要调用play()方法，且只支持click方法

3android4.4以下版本，设置圆角属性需要在直接元素上，向父元素设置圆角并且指定overflow:hidden是不会生效的。

4、红米手机，ua返回iphone，需要结合platform判断，但是还不准确，导致需要ios和android区别对待的时候就坑了。

5、fixed的问题。这个解决办法是尽量不要用，不过ios7及以下才会出现这个问题。某些情况下红米也会有这个问题。

6、如果你想要使用css3的动画，那么一定要变着方式使用3d gpu加速的方式，不要试着left，height，width这样的元素进行变换了，android4.4以下版本卡死你。

7、移动端click点击会有300毫秒延迟，使用fastclick，tap解决。这个插件最良心了。

8、1px问题

9、qq浏览，uc浏览以及ios的浏览器，滚动时不会触发scroll事件，但会触发touchmove。当停止滚动后会出发scroll。

10、-webkit-tap-highlight-color可以取消点击高亮。

11、localStorage在浏览器开启无痕模式下ios会抛异常，导致js中断。

12、一些情况下对非可点击元素监听click事件，ios下不会触发，css增加cursor:pointer就搞定了。当然想要干脆静止点击就是not-allowed。

13.（iPhone5以上各种应用的webview（例如微信）在遇到有大量图片的页面时会出现图片乱套的情况，6和6plus更为严重，具体表现为各种img和background-image互相错乱，目前研究出暂时的解决方法是动态给所有用到图片的元素加上

-webkit-transform : translate3d(0,0,0)

进行强制重绘，测试结果对于绝大部分出现问题的机子有效，但仍然有小部分机器还是会出问题，另一种方法是进行懒加载，但是这会降低开发效率，并且对使用background-image的元素比较难实现

*修正：

关于iPhone图片乱串的问题，后来使用OS X的Safari调试后发现并不是渲染问题，而是请求回来的图片本身就算错的，最后通过修改从多个CDN地址取图或者把图分散到不同目录下后问题解决，多次测试后也再没有出现问题。

现在具体的原理还不知道，因为只有iOS会出现问题所以我们怀疑部分CDN的配置与iOS的请求机制不兼容，暂时可以归位玄学问题XD）

14.safari（包括OS X、iOS和Windows版）对transform-origin的Z轴判定和其它所有浏览器都不同，设置transform-origin的Z轴会直接产生translateZ的变换，十分不理解，暂无纯css解法

15.Android调用重力传感器返回的数据和iOS和Windows Phone上的是相反的……

16.Android微信内置webview对meta viewport的支持有缺陷，当user-scalable=no时，设定width为固定数值（例如640）不会自动缩放，需要用js做一些处理

（新版微信已经修正了这个问题）

17.Android的各种浏览器都不支持同时播放多个音频，并且通过js连续播放几个音频的时候会出现一些问题。

18. iOS 弹出键盘时，viewport 高度并不会变，但是 Android 是变的。所以 iOS 上 fixed 在底部的元素显示不出来。

19.、做点击跳转，长按删除功能的时候坑比较多：

（1）组合使用touchstart,touchmove,touchend,click事件；

（2）部分机型按到文字会弹出选择，复制的选项，使用 onselectstart="return false;" 禁掉；

-- 之后才知道有很多移动端事件处理库可以用,如 hammer.js

20、translate3d会引起兄弟元素的z-index层级无效；原因是t3d实际是有z轴层的变换，解决办法自己处理的是在兄弟元素上也加上t3d。

21.在andriod上的uc浏览器里video标签默认的z-index是最大max的 ，谁也遮盖不住它

22.IOS微信（version 6.5以上）的video不支持autoplay了，需要触发播放事件（load()也不好使）；iOS 不支持loadedmetadata事件；安卓不支持duration update等事件；

22.注册事件的元素尽量可别用-webkit-filter 这个属性，点击半天才执行事件