移动端浏览器兼容问题

目前，移动端的浏览器兼容问题也不少，在这里做下记录，便于以后查找问题。

1、click 300ms 延时响应

解决方案：使用fastclick

window.addEventListener("load", function () {FastClick.attach(document.body)
}, false)

2、flex的问题

父元素设置display：flex后，一个子元素使用flex-basis设置固定宽度，另一个设置flex：1占满剩余空间时失效

解决办法：在设置flex：1的子元素里加上一个min-width：0解决

3、1px的像素线

父元素的font-size设置为0，子元素再做设置需要的大小

4、IOS移动端页面input输入框不回弹

document.body.addEventListener('blur',function(){window.scrollTo(0,0)
},true)

失去焦点后，重置页面位置到顶部

移动端浏览器兼容问题相关推荐

fetch移动端浏览器兼容问题
pc端浏览器请求数据正常,在钉钉中显示空白原因是钉钉的内置浏览器不兼容fetch,借鉴了大神的经验https://blog.csdn.net/qianzhihe1992110/article/det ...
移动端浏览器兼容问题和解决办法
问题一:移动端,input的键盘的右下角显示搜索(2个字) 解决:<form action=""><input type="search" p ...
移动端和pc端浏览器兼容问题及处理
一.关于移动端兼容性目前针对跨终端的方案,主要分为两大阵营:一套资源Vs两套资源. 第一种是通过响应式或页面终端判断去实现一套资源适配所有终端: 第二种是通过终端判断分别调取两套资源以适配所有终端. ...
PC端浏览器兼容测试总结
总结了下目前公司所做的兼容性大致流程: 1.兼容性测试验收标准(验收范围.浏览器选择) 2.方案选择 3.测试执行 [1.1 验收范围] 验收标准: 主流程业务正常.界面样式正常.功能测试正常涉及各 ...
ios 与安卓移动端浏览器兼容笔记
1.fixed 定位问题在安卓中使用fixed定位正常但是在ios中下滑页面时 fixed定位的不动停留在原地 2.active hover 在安卓正常触发在ios 无法触发问题解决: 在 ...
二倍图（物理像素物理像素比，多倍图，背景缩放），移动端开发选择（移动端主流方案【单独制作移动端页面（主流），响应式页面兼容移动端（其次）】，移动端技术解决方案【移动端浏览器，特殊样式】）
二倍图物理像素&物理像素比物理像素指的是屏幕显示的最小颗粒,是物理真实存在的,我们开发的1px不一定等于1个物理像素,(PC端相同,移动端不一定相同) PC端和早期手机屏幕是 1CSS像素 ...
PC端微信内置浏览器兼容问题
PC端微信内置浏览器兼容问题微信自带浏览器用的是QQ浏览器X5内核,而X5内核是腾讯基于开源Webkit优化的浏览器渲染引擎,目前除了微信.手机QQ.京东等有30多款APP内置浏览器都是基于X5内核 ...
浏览器兼容和移动端适配方案
1.浏览器兼容: 一.css兼容: 不同浏览器的标签默认的margin和padding不同问题症状: 随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大. 碰到频率: ...
浏览器兼容问题透明度 position：fixed bootstrap
浏览器兼容问题:主要是ie8以下: 用bootstrap框架结合jq写页面,因为bootstrap有好多@media和html5所以要在引入样式后引入两个js <!-- HTML5 shim a ...

移动端浏览器兼容问题

移动端浏览器兼容问题相关推荐

最新文章

热门文章