那些移动端web踩过的坑2】的更多相关文章

原文链接:https://geniuspeng.github.io/2017/08/24/mobile-issues/ 扔了N久,还是捡回来了.好好弄一下吧.刚工作的时候挺忙的,后来不那么忙了,但是变懒了.这一年大多数时间都在在做移动端的东东,做了之后才发现,同样是web前端,移动端的坑真的是深不可测,各种各样的,只有想不到,没有遇不到.在这里把最近踩过的坑整理一下. No.1 大字体问题 首先,要解决的关键问题是如何为设备选择可视视口尺寸,采用理想视口尺寸作为可视视口尺寸,代码也十分简单,只需…
原文链接:https://geniuspeng.github.io/2018/04/26/mobile-issues2/ 坑是无穷无尽的,嗯-长江后坑推前坑~~ 关于音频自动播放 H5的audio标签实现了浏览器端的音频播放可能性,虽然目前的手机浏览器也都支持这个标签和相关属性,但不同的手机对其表现行为还是五花八门,而且有的时候还和客户端那边的音频控制相关.这次遇到了一个问题是iOS中无法自动播放音频(autoplay无效,目测他们是考虑了流量问题吧),解决方法也还好,一般如果是微信里,可以使用…
前言:接着上一篇项目总结,这一篇是学习过程记录的最后一篇,这里会梳理:评论组件.商家组件.优化.打包.相关资料链接.项目github地址:https://github.com/66Web/ljq_eleme,欢迎Star. ratings seller 一.评论组件-ratings 评论组件主要分为三块 评分信息-overview 评论选择-ratingselect 评论详细信息 评分信息部分 左侧评分 布局Dom <div class="ratings-content">…
1.为非a列表项添加触感样式 通过js注册touchstart和touchend事件,添加触感class的方式, 有个坑,低版本的Android浏览器,经常触发不到touchend,需要再额外注册一个touchcancel. 2.IOS webview的fixed满屏遮罩      bottom或者height需要多设置一些,不然首屏往下滚页面的时候,页面底部会有1px未遮到的间距,页面快速往上棍咚时,也会因为来不及渲染导致遮罩不完整.(只测了pod ios6)…
前言: 和弟弟合作, 一起整了个智慧屋的小web站点, 里面包含了很多经典的智力和推理题. 其实该站点从技术层面来分析的话, 也算一个信息发布站点. 因此在该网站的后台运营中, 富文本的编辑器显得尤为重要. 本文将讲述两种使用富文本编辑器的思路, 重点讲述弹出式形态的实现思路, 以及中间踩过的坑. 基础: 文章的编辑采用ueditor作为富文本编辑器, 而前框的框架则使用bootstrap, 下文的解决方案都是基于此的. ueditor的相关博文: • ueditor和springmvc的集成…
前端踩的一些坑   前端踩的一些坑 本节内容 事件代理 清除标签的所有事件 bootstrap的模态框自定义方法 ajax在django里面实现post提交 ajax提交数据嵌套 1.事件代理 之前写前端的时候发现在ajax里面获取到的部分html插入到主页面中,插入的部分html中的button始终无法绑定click事件...各种找问题,最后发现锅是在页面刚请求到的时候,那部分ajax请求到的页面还没有加载到主html中,js绑定事件的时候找不到这个标签,于是就绑定失败. 之后在网上找相关资料…
最近一直在写移动端页面,由于之前写移动端写的比较少,所以此次踩过许多坑.特此总结一下: 1.<input type='button'>背景色在ios中的兼容性,颜色发白 解决办法:在全局样式中加入以下代码: input[type=button], input[type=submit], input[type=file], button { cursor: pointer; -webkit-appearance: none; } 2.在vue中使用jquery weui中的地区选择器时,通过点击…
apicloud技术浅谈 导语 apicloud 的学习也有一段时间了,这是我个人的一些经验,和踩过的坑,希望对大家能有一些帮助. apicloud的知识准备 apicloud 是一个用原生的思想搭建包含window.frame.widget 的框架,内容用html.css去布局,js进行数据交互;所以首先要熟悉web三件套,html+css+js;因为是移动端,建议大家采用rem布局或者是flex布局进行屏幕适应. css布局(简单介绍rem和flex) rem是根据html的font-siz…
腾讯Bugly特约作者:贺辉超 1 H5 缓存机制介绍 H5,即 HTML5,是新一代的 HTML 标准,加入很多新的特性.离线存储(也可称为缓存机制)是其中一个非常重要的特性.H5 引入的离线存储,这意味着 web 应用可进行缓存,并可在没有因特网连接时进行访问. H5 应用程序缓存为应用带来三个优势: 离线浏览 用户可在应用离线时使用它们 速度 已缓存资源加载得更快 减少服务器负载 浏览器将只从服务器下载更新过或更改过的资源. 根据标准,到目前为止,H5 一共有6种缓存机制,有些是之前已有,…
1.前言 有过移动端开发经历的开发者都深有体会:移动端IM的开发,与传统PC端IM有很大的不同,尤其无线网络的不可靠性.移动端硬件设备资源的有限性等问题,导致一个完整的移动端IM架构设计和实现都充满着大量的挑战.本文将简述移动端IM最重要的架构设计和通信协议选择方面的坑点,希望为IM开发者同行带来些许启发.(本文同步发布于:http://www.52im.net/thread-289-1-1.html) 2.学习交流 - 即时通讯开发交流群: 215891622 [推荐] - 移动端IM开发推荐…