1、ios js中时间不兼容YYYY-MM-DD这种格式的时间,只支持YYYY/MM/DD这种格式

// 在safari中
new Date('2018-09-02') // Invalid Date
new Date('2018/09/02') // Sun Sep 02 2018 00:00:00 GMT+0800 (中国标准时间)、

2、问题描述:ios手机上,网页中可滚动区域滚动不流畅,手指滑动多少页面就只滚动多少,没有弹性效果

解决办法:-webkit-overflow-scrolling : touch;

3、使用 $(window).resize(...) 无效。

可能由于框架或插件原因,有时候$(window).resize(...)不生效。

解决方案:使用 window.onresize = function () {...} 即可。

4、iphoneX适配方法。

iphoneX屏幕组成:上部齐刘海(44px)+ 安全区域(safe area)+ 底部手势区域(34px)。

1):设置viewport-fit

viewport-fit可以取两个值contain(默认)或 cover

viewport-fit=contain:页面内容显示在安全区域;

viewport-fit=cover:页面内容显示在整个屏幕;

通常需要设置 viewport-fit=cover,如下:

<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
2):媒体查询

@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3){
    //这里写需要调整的样式
}

3):当设置viewport-fit=cover时,如下四个值需要设置,页面才会显示在安全区域中,设置如下:

 body { 

        padding-top: constant(safe-area-inset-top);  //为导航栏+状态栏总高度(88px)

        padding-left: constant(safe-area-inset-left);    //如果未竖屏时,为0  

        padding-right: constant(safe-area-inset-right);   //如果未竖屏时,为0  

        padding-bottom: constant(safe-area-inset-bottom);   //为底部圆弧高度(34px)

    }

5、往返缓存问题

点击浏览器的回退,有时候不会自动执行js,特别是在mobilesafari中。这与往返缓存(bfcache)有关系。

解决方法 :window.onunload = function(){};

6、calc的兼容性处理

CSS3中的calc变量在iOS6浏览器中必须加-webkit-前缀,目前的FF浏览器已经无需-moz-前缀。 Android浏览器目前仍然不支持calc,所以要在之前增加一个保守尺寸:

div { 
width: 95%; 
width: -webkit-calc(100% - 50px); 
width: calc(100% - 50px); 
}

借鉴来源:https://www.aliyun.com/jiaocheng/359247.html

    https://www.cnblogs.com/luckyXcc/p/6237933.html

    https://www.cnblogs.com/stoneniqiu/archive/2016/11/19/6077112.html

更多安卓、ios兼容问题借鉴:https://www.aliyun.com/jiaocheng/topic_734.html?spm=5176.100033.1.14.d8b15771yYc5Cz  

webapp 安卓 ios 兼容性问题的更多相关文章

  1. Nginx集群之.Net打造WebApp(支持IOS和安卓)

    目录 1       大概思路... 1 2       Nginx集群之.Net打造WebApp(支持IOS和安卓) 1 3       安卓模拟器... 1 4       MUI框架... 3 ...

  2. 点击复制文字到剪贴板兼容性安卓ios

    一般那种活动H5分享可能会用到点击复制文字到剪贴板,很简单的功能 于是搜了一搜:js复制文字到剪贴板,可用结果大致分为两类: 一类是js原生方法,这种方法兼容性不好,不兼容ios: https://d ...

  3. .net 安卓IOS跨平台des加解密双向的(可以互相加解密)

    #region 跨平台加解密(c# 安卓 IOS) // public static string sKey = "12345678"; // /// // /// 解密 // / ...

  4. 安卓ios和angularjs相互调用解决首次调用ios传递标题失败的问题

    1.angular 调用客户端方法放在 try catch中 try { js_invoke.showShareDialog(angular.toJson(obj));  // 在这里放客户端的方法即 ...

  5. 安卓ios各版本及分辨率占比

    Google Play 安装统计数据 只有安卓的 https://developer.android.com/about/dashboards/index.html?hl=zh-cn 腾讯移动分析 安 ...

  6. 史上最简单JS复制功能,兼容安卓ios!

    1.JS复制原理: 被复制内容的元素不能被其他元素遮盖,否则无效.  (设置opacity透明为0,不可以设置display:none); 2.常规的复制方法 function copyUrl2() ...

  7. ios、安卓前端兼容性

    1.日期兼容性 解决方法(请看我上一篇文章)安卓.ios时间转换成时间戳的形式 2.input框聚焦,ios出现outline或者阴影,安卓显示正常 解决方法 input:focus{outline: ...

  8. ios、安卓的兼容性

    日期转换成时间戳: 安卓下可以使用 Date.parse(new Date('2019-11-18 12:00:00')) 直接转换,结果为 1574049600000 ios下 Date.parse ...

  9. ios、安卓前端兼容性1

    2.input框聚焦,ios出现outline或者阴影,安卓显示正常 解决方法 input:focus{outline:none} input:{-webkit-appearance: none;} ...

随机推荐

  1. ACM总结——2017ACM-ICPC北京赛区现场赛总结

    现在距离比赛结束已经过了一个多星期了,也是终于有时间写下心得了.回来就是被压着做项目,也是够够的. 这次比赛一样是我和两个学弟(虽然是学弟,但我的实力才是最弱的T_T)一起参加的,成绩的话打铁,算是情 ...

  2. Java正则表达式草稿程序*2

    1.成绩统计. 输入文件input.txt: 张三 语文12 数学31 英语11 李四 语文22 数学22 英语22 王五 语文33 数学33 英语33 期待输出output.txt: 张三 语文12 ...

  3. 【题解】JSOIWC2019 Round2

    题面: 题解: T1: 毕竟是tg膜你,不会太难 就是一道简单贪心 首先,对于a<=b的所有物品,一定是贪心的按照a从小到大放入. 先假设剩下的物品可以按照某种顺序放进去,那么可以得到一个最终空 ...

  4. Learning-Python【21】:Python常用模块(4)—— re、logging、hashlib、subprocess

    re 模块:与正则相关的模块 在使用 re 模块之前,需要先了解正则表达式(regular expression),描述了一种字符串匹配的模式(pattern),可以用来检查一个字符串是否含有某个子字 ...

  5. 线性回归(linear regression)

    基本形式 最小二乘法估计拟合参数 最小二乘法:基于均方误差最小化来进行模型求解的方法称为“最小二乘法”(least square method) 即(左边代表 $\mathbf{\omega }$ 和 ...

  6. Yarn 踩坑 : ERROR: Cannot find configuration directory "/xxxx/xxxx/xxxxx/hadoop-x.x.x/conf"

    解决:在 yarn-env.sh 中,指定 YARN_CONF_DIR 为 hadoop 目录的 /etc/hadoop 在yarn-env.sh 中,配置: export YARN_CONF_DIR ...

  7. ugui 灰度shader mask冲突解决 转。。。

    项目上遇到了一个问题,灰度shader无法在mask下使用,两个之间会一定的冲突.经查验是mask组件对shader的相关属性有要求,添加相关的属性则可符合要求使其他shader使用UGui里的mas ...

  8. JAVA深入研究——Method的Invoke方法(转)

    原文地址:http://www.cnblogs.com/onlywujun/p/3519037.html 在写代码的时候,发现Method可以调用子类的对象,但子类即使是改写了的Method,方法名一 ...

  9. spring-mvc默认首页配置

    一想到默认首页,很多人可能首先想到的是在web.xml如下配置: <welcome-file-list> <welcome-file>xxxx/xxx</welcome- ...

  10. SpringCloud注册中心环境搭建euraka