HTML5技术

移动端开发的坑【持续更新...】 - 欧阳不乖

字号+ 作者:H5之家 来源:H5之家 2015-09-24 10:23 我要评论( )

现在大家基本都是使用智能手机,貌似手机上的浏览器也都比较高级,还基本都是webkit内核,乍一听,好像看到了希望。。。可是,移动端的坑并不比IE少,并且因为调试没有PC上那么方便,貌似更难了。。。 简单总结几个自己在平时开发遇到的相对浅的坑,先预预热

现在大家基本都是使用智能手机,貌似手机上的浏览器也都比较高级,还基本都是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;}隐藏输入密码;

         (发现人类的智慧是无限的啊~~~)

 

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

 

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • [移动端] IOS下border-image不起作用的解决办法 - 小路_同学

    [移动端] IOS下border-image不起作用的解决办法 - 小路_同学

    2017-05-02 12:04

  • 【Vue 入门】使用 Vue2 开发一个展示项目列表的应用 - zhangjk

    【Vue 入门】使用 Vue2 开发一个展示项目列表的应用 - zhangjk

    2017-04-30 16:00

  • 在Delphi下使用迅雷APlayer组件进行免注册开发 - Delphi力量

    在Delphi下使用迅雷APlayer组件进行免注册开发 - Delphi力量

    2017-04-28 15:00

  • 随应潮流-基于ABP+Angularjs现代化应用软件开发框架(1)-总体介绍 - 在路在的张

    随应潮流-基于ABP+Angularjs现代化应用软件开发框架(1)-总体介绍 -

    2017-04-22 08:04

网友点评