移动前端开发的坑

1. 域名劫持

https://mp.csdn.net/postedit/89177394

2.webkit不同版本兼容性问题

1、最痛恨的是红米手机,ua返回iphone,需要结合platform判断,但是还不准确,导致需要ios和android区别对待的时候就坑了。
2、是fixed的问题。这个解决办法是尽量不要用,不过ios7及以下才会出现这个问题。某些情况下红米也会有这个问题。(最近刚刚遇到,已经被坑挂了)。
3、如果你想要使用css3的动画,那么一定要变着方式使用3d gpu加速的方式,不要试着left,height,width这样的元素进行变换了,android4.4以下版本卡死你。
4、ios全线点击会有300毫秒延迟,使用fastclick解决。这个插件最良心了。
5、web app像素眼设计会纠结你1px边框问题。解决办法有相应知乎大牛答过。
6、qq浏览,uc浏览以及ios的浏览器,滚动时不会触发scroll事件,但会触发touchmove。当停止滚动后会出发scroll。
7、滚动有iscroll插件,但是还是使用原生的比较好。
8、meta功能要用好,禁止缩放,缩放比例,屏蔽电话号码等功能很实用。(手机回答就不列举了)。
9、如果想要像手机淘宝那样的各个平台看起来展示效果一致,那么就使用rem来做单位。
10、-webkit-tap-highlight-color可以取消点击高亮。
11、localStorage在浏览器开启无痕模式下ios会抛异常,导致js中断。
12、一些情况下对非可点击元素监听click事件,ios下不会触发,css增加cursor:pointer就搞定了。当然想要干脆静止点击就是not-allowed。
13、android4.4以下版本,设置圆角属性需要在直接元素上,向父元素设置圆角并且指定overflow:hidden是不会生效的。

14. iOS8 的 webview 加载网页,不支持使用 createElement 创建 video 元素播放 hls 视频流,然后动态指定 parent,会导致 app 崩溃。并且,webview 视频内嵌播放模式下点击全屏按钮会导致 app 崩溃。

3.css/js陷阱问题

 

4.webkit bug

1. WebKit 533-(微信、UC v9.8 开发者版)在遍历 带伪元素规则的 CSSStyleRule 对象时,会直接让浏览器崩溃(下断点走单步时基本没事,一释放断点立马崩溃,所以怀疑是栈溢出)—— 检测到老内核 直接跳过那段代码……(对老浏览器砍功能)

5. 不同浏览器内核兼容性问题

微信ios二维码识别,不能放fix div里。safari translate3d(0,0,0). safari 有个tap event。safari 的a style cursor:pointer。基本上全是safari 的坑。 还有stupid safari mobile, IE 都没问题的东西它出问题。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值