最近写移动端页面的时候遇到的一些小问题, 主要是微信页面
1.布局问题
flex布局,在写这个移动端页面的时候我布局很多时候都是使用的最新的flex 布局,写起来很舒服 , 效果也很好 ,在大部分移动端机型上效果也如预期的一样, 但是到了iOS8.1的手机上的时候 , 我发现flex布局就完全不起作用 , 我开始还认为是前缀的问题 ,加上-webkit-之后还是没有效果 ,我又尝试了老版的flex-box,结果还是不行 , 这就比较蛋疼了, 最终为了兼容,还是放弃了flex布局。
2.css3动画
在移动端页面上经常会用到很多css3动画的效果 , 但是自己去写又很花时间 , 所以我推荐用 animate.css , 它预设了很多常用的动画效果 , 用到动画不是很多的时候 , 可以在里面找到想要的动画效果把代码拿出来。
3.audio标签
预加载audio,使用onloadedmetadata事件
加载完成之后需要先 play()、pause(),然后再使用。否则会有一些奇怪的问题, 比如:加载完成直接播放audio1 , 在到一个点暂停audio1,播放audio2的时候会在ios9,ios10等一些机器上出现 只有audio1有声音,audio2没有声音的情况。
4.微信接口获取用户昵称
有些微信用户昵称含有图片字符 , 在拿到的时候会转换为乱码有时会包含 单引号 或者 双引号,所以不能通过模板变量直接赋值的方式获取 , 需要放在隐藏域通过dom方式获取value或者隐藏的div获取其html的方式获取。