移动端开发的坑【持续更新...】

现在大家基本都是使用智能手机，貌似手机上的浏览器也都比较高级，还基本都是webkit内核，乍一听，好像看到了希望。。。可是，移动端的坑并不比IE少，并且因为调试没有PC上那么方便，貌似更难了。。。

 

简单总结几个自己在平时开发遇到的相对浅的坑，先预预热。

 

一 安卓手机叠加区域高亮：这是我看网上的人起的名字，表现就是点击的时候一片阴影，对功能没什么阻碍，就是不好看；

　　　　解决方案：{-webkit-tap-highlight-color:rgba(0,0,0,0)};

 

二 部分浏览器无法自动播放音频： 这个部分貌似是暗指苹果设备吧（偷笑...），没办法，人家就是用户体验好，怕你骚扰用户；

　　　　解决方案：可以捕捉一次用户的任意操作，然后手动触发媒体播放事件；

 

三 部分浏览器不支持局部滚动：移动端的滚动事件一直都感觉好难啊...

　　　　解决方案：1利用布局，给body设置滚动，其他元素错位显示；（尚未实践...囧...）

　　　　　　　　   2使用第三方iscroll，这个是我一贯的解决方式；

 

四 诡异的input悬浮框：经测试type=password类型的input框会有额外的一个输入框悬浮在原input旁边；

　　　　解决方案：使用type=text输入框代替密码类型，然后设置样式{-webkit-text-security:disc;}隐藏输入密码；

　　　　　　　　　（发现人类的智慧是无限的啊~~~）

 

暂时就这几个，移动端的项目虽然一直也在做，涉水还没那么深，所以暂时还没掉入哪个深渊里...真心感谢前面填坑的前辈们！