IOS典型问题之一，但是网络上找不到更好的方案，决定没有就自己创造新方案，里面很清楚的描述我的整个思考过程，从中不断思考出各种方案，最终经过亲自实践总结出来，非常适合要移动端开发的你

适配的含义 可视、可操作区域是在安全区域内。 没有做适配的情况： 安全区的含义 不被圆角、齐刘海、底部小黑条（Home Indicator）遮挡的长方形。 H5页面适配安全区 运用：安全区要根据具体场

时隔 3 年，重新接触了移动端 h5 页面开发，上一次还是大四实习。这一次是 hybrid 开发，涉及到 h5 页面与原生 app 的交互，h5 页面需要与原生打通登录态，以及调

既然我们使用了 WebView 来承载 H5，那么便少不了与 Native 之间发生交互，WebView 所承载的页面，通过 JS 与 Native 进行通信，我们将这个通信的”桥梁“为 JSBridge。如果你参与过微信内置浏览器的 H5 开发，会发现一个经常出现的东西，叫做…

在面试中我们常会被问到怎么解决1px问题，要知道解决方案，我们首先要知道这个问题的来源。在这篇文章里，我会尽可能通俗的阐述这个问题出现的源头，一起去思考这个问题的解决方案。

随着移动端市场的份额越大，需求就越多样化。我们今天讨论的是移动端的滚动穿透问题。上面这段调侃的话可以看出需求中弹窗浮层还是挺常见的，那这个和滚动穿透有什么联系呢？ 接下就说下我对滚动穿透问题解决方案探索的过程，希望对大家有点启发。 接到这个需求觉得没有难度，很快就提测了，然后就…

这两天自己在写一个手机网页，用到了触屏滑动的特效，就是往右滑动的时候左侧隐藏的菜单从左边划出来。 做完之后在手机原生浏览器中运行正常，但在QQ和微信中打开，发现touchmove只会触发一次，而且touchend也经常不触发。 主要是由于200ms超时导致内核不一定会一直处理t…

需求是这样的：在页面上做一个浮动的小图标，可以拖拽移动它。 大家都知道，移动端拖拽事件主要就是利用touchmove。为了防止拖拽它的时候，禁止浏览器的上下滚动，我的方法是在onTouchStart中将html和body的样式设为 height: 100%; overflow:…

在移动端的H5页面中，我们经常会遇到 点击按钮-->弹窗-->选择选项 这样的场景。滚动滚动条至容器的底部或者顶部，再往上或往下拖动滚动条时，滚动动作会出现穿透，所谓滚动穿透问题