先来整理一下，瞧瞧需要实现的核心功能。 从易到难，先来看看页面的结构布局。 一目了然就直接贴代码了。 根据图片就可以看出来，存在2个区域。 绿框包围的范围，包含有字母标题和对应的子项。 为了节省一下文章的篇幅，这里就不贴图了，很简单，就是并排下来就好了。 接下来是wxss的样式…

在前端进行开发H5页面的时候，常常会有一些需要内嵌到APP的H5页面。在APP中使用H5页面主要是由于它是运行在浏览器上，所以只需要开发一次便可以在不同的操作系统上显示，并且迭代版本很方便。开发成本比较低。 在开发的过程中，经常需要和APP进行交互。本文已H5的角度整理了双方交…

刚入门前端的时候写过很多的微信H5页面，时隔多年感觉应该是手到擒来，不曾想竟很是费了一些功夫。现在把本次开发过程中遇到的问题以及我是如何解决的，做个记录。防止自己以后再去解决解决过的问题。 网页授权流程分为四步，这里只说前端需要做的，其中的第一步：跳转授权页面获取code。 本…

兼容适配问题是前端开发经常面对的，以下来源于个人开发中的见解，用于加深记忆，也为了能提高自己归纳总结的能力，更为了方便日后查看

最近给公司微信公众号，写了微信h5业务页面，总结分享一下前端开发过程中的几个兼容性坑，项目直接拿的公司页面，所以下文涉及图片都模糊处理了。 当点击输入的时候，光标的高度和父盒子的高度一样。例如下图，左图是正常所期待的输入框光标，右边是ios的input光标。 出现原因分析：通常…

本文为平时开发过程中在iOS（Safari）上遇到兼容性问题的总结和记录。 但只用这个方法在ios10以后就不行了，webkit官方认为现在的网页似乎都喜欢设置user-scalable=no 使用户无法缩放页面，这会使一些页面因无法正常缩放而无法看清字体，比如一些为pc设计的…

最近一段时间在做 H5 聊天项目，踩过其中一大坑：输入框获取焦点，软键盘弹起，要求输入框吸附（或顶）在输入法框上。需求很明确，看似很简单，其实不然。从实验过一些机型上看，发现主要存在以下问题： 在 Android 和 IOS 上，获知软键盘弹起和收起状态存在差异，且页面 web…

遇到问题：延伸问题总结，第二条：在移动端页面使用上传文件或者图片时，IOS和安卓的展现方式有很多不一样。 因为能找到的手机机型，毕竟有限，以上的最终解决方案，是否还有后续问题，是否都能搞定，还不能确定。如果之后在遇到有问题手机，代码不适应在重新更新代码。。。当然如果有小伙伴们看…

最近半年一直在做移动端h5，主要环境为微信、和app内的WebView。期间遇到很多不同系统和设备的兼容性问题，希望在这整理成集锦，便于日后查找。当然，如果你也刚好遇到同样的问题，希望对你有所帮助。 1. 音视频问题 微信中不允许自动播放。但是可以借助WeixinJSBridg…