手机开发遇到的若干坑（持续更新）

UC广告拦截：如果将节点 class 或者图片名称定义成 ad ，将有可能被拦截，图片被删除。

使用css3做动画效果需要加一大堆的setTimeout，暂无解决方案……

手机动画建议在大量 transform 的父层加上 translateZ(0) 以提升渲染性能（解决某些机型动画闪屏问题）。

涉及到尺寸的尽量用rem做单位（大屏幕下直接媒体查询设置 html 的字体大小）。

对于一屏显示的页面，还是老老实实用百分比%吧，所有尺寸都用%，包括图片在内（图片在 iphone 下有时候会拒绝高度设置，把它弄成背景图就好了）

------------------------------------2015.09.08更新-----------------------------------------------------------------------

HTML根节点设置 background-attachment:fixed 导致微信图片渲染模糊！！！！！！！！你他喵的大坑

------------------------------------2015.11.26更新-----------------------------------------------------------------------

translate3d 会导致父层的 overflow-x:hidden 或 overflow-y:hidden 失效，解决办法是改成 translate。需要注意的是，涉及到 3d 的变换效果都会导致一些布局上的奇怪现象，慎用。。。

audio 元素加 load() 方法在IOS9+以上会把音乐文件下载下来，页面关闭后音乐还在播放。。。。

对于手机站点做多个页面跳转体验不佳，做在一个页面里面然后用 location.hash 来控制步骤是比较爽的，配合 window.onhashchange 来操作每个界面

爱疯下有个很抓狂的特性就是整个页面可以被拖动，然后路出黑黑的底色，如果你页面中有 position:fixed 的元素那就惨了，他们不会跟着被拖动，会被截掉，效果不要不要的，解决办法就是改成 position:absolute，这样元素就会跟着页面被拖动了

用 vw 做html根节点的字体大小(我一般设置为 font-size:5vw )，但是 ipad 下如果你设置了媒体查询设置 html 宽高的话，横屏再竖屏字体大小就会错

translateX或者translateY值超过1000%时会有预想不到的样式问题