小昱个人博客
欢迎来到小昱的世界

勤学如春起之苗,不见其增,日有所长;辍学如磨刀之石,不见其损,日有所亏
[解决方案]前端开发中iOS适配遇到的那些坑
  • 首页 > 前端
  • 作者:小昱
  • 2017年7月21日 11:04 星期五
  • 浏览:145
  • 字号:
  • 评论:0
  • 一、苹果ios用js的Date()出现NaN问题解决办法

    最近在做项目的时候,发现使用iOS手机传递时间到后台的时候老是出现NaN,而安卓手机正常。经过一番排查,发现苹果手机不能识别日期格式的-

    this.orderParms.sch_time = new Date('2017-04-28 23:59:59').valueOf()

    换成如下方式就正常了,就是‘-’换成‘/’

    this.orderParms.sch_time = new Date('2017/04/28 23:59:59').valueOf()

    参考资料:

    http://blog.csdn.net/cookysurongbin/article/details/70799679

     


    二、使用苹果手机定位出现跳动的情况

    有的时候需要将页面的一部分固定,其余部分滚动,以下是遇到坑的代码:

    html

    <div class="box">
      <div class="topPart">
        <div class="content"></div>
      </div>
      <div class="bottomPart">bottomPart</div>
    </div>

    css

    .topPart{
      height: 100em;
      background-color: #fff;
      margin-bottom: 4em;
    }
    .bottomPart{
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      height: 4em;
      line-height: 4em;
      background-color: #000;
      color: #fff;
    }
    .content{
      height: 30em;
      background-color: #f00;
    }

    以上代码在安卓机上测试正常,不过到了苹果手机下面固定的部分会跳动

    以下是解决方法,将上下两部分均定位即可

    .box{
      position: relative;
      height: 20em;
      overflow: hidden;
    }
    .topPart{
      position: absolute;
      bottom: 4em;
      top: 0;
      left: 0;
      right: 0;
      overflow: auto;
      box-sizing: border-box;
    }
    .bottomPart{
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 4em;
      line-height: 4em;
      background-color: #000;
      color: #fff;
    }
    .content{
      height: 30em;
      background-color: #f00;
    }

     


     

      您阅读这篇文章共花了:  
    二维码加载中...
    本文作者:小昱      文章标题: [解决方案]前端开发中iOS适配遇到的那些坑
    本文地址:http://www.xiaoyulive.top/?post=108
    版权声明:若无注明,本文皆为“小昱个人博客”原创,转载请保留文章出处。
    返回顶部| 首页| 碰碰手气| 捐赠支持| 手机版本|后花园

    Copyright © 2016-2017 小昱个人博客 滇ICP备16006294号