码迷,mamicode.com
首页 > 其他好文 > 详细

地址选择功能

时间:2017-08-18 23:46:05      阅读:187      评论:0      收藏:0      [点我收藏+]

标签:本地缓存   页面   border   display   本地   back   ges   boa   dex   

 

  好久以前的工作了,今天才抽出时间来整理一下,免得以后时间久了不记得了。先看看截图

  技术分享技术分享

  本来之前这是做的一版混合app,后来又开发了一个触屏版的。app框架里面封装好了两个也买之间传值没什么问题的,但是放app里面就只能呵呵了,两个页面怎么传值呢??

我能想到的就两种方案:1.用iframe. 2.使用浏览器本地缓存。使用本地缓存如果用户清除了浏览器缓存怎么办就没了。所以想了一下还是用iframe吧。好了开始行动,噼里啪啦,不一会儿完工了,开开心心的拿来手机测试。惨了,苹果机就出问题了,苹果机下确定按钮因为在iframe中就有半截下去了,还拖都拖不回来。。。好捉急啊。。。

  看了一下iframe全屏用的固定定位,影响到里面的fixed定位了。那就拿出来吧!又噼里啪啦把里面的按钮搬出来吧,还得改js改吧,改吧。。。

拿出来了,按钮好了,继续测试。哎呀!这里怎么有个输入框技术分享,fixed定位跟输入框就是冤家,果然不出所料,真的出问题了。输入框获取焦点之后,手机键盘弹出。后面的东西就不听使唤了,固定定位根本就顶不住,定不住啊!!!上网找找资料。。。

  用局对定位代替模拟固定定位。具体做法如下:

  1.iframe:

  /*嵌入的iframe*/
  .Iframe{position: absolute;width: 100%;height:auto;top:0;left: 0;background: #fff;z-index: 10000;display: none;bottom: 0;right: 0;}
  .Iframe iframe{border: none;width: 100%;height: 100%;}

  js给Iframe高度动态赋值。

  2.选择地址iframe后面页div

需要给他的高度动态赋值,同时把overflow:属性设置为hidden;

技术分享

3.用户选好地址点击确认后关闭iframe弹出框页面,overflow:属性设置为auto。

这就算完了,在找来一大波手机测试一下,安卓,没问题,ios也没问题,挺好,终于可以开开心心下班了~_~ ~_~

 

地址选择功能

标签:本地缓存   页面   border   display   本地   back   ges   boa   dex   

原文地址:http://www.cnblogs.com/ffyyy/p/7392471.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!