安卓手机微信页面position: fixed位置错误
今天做项目的时候发现动用position: fixed做弹窗时,用margin-top:50%这样外边距来响应式的控制位置时,在微信里打开页面的弹窗,弹窗在手机上显示的位置和实际上在手机上的位置不一样,让人点击上面时并没有反应,其实他实际位置时在眼睛看到的位置上方许多,点击上方许多的位置时,才触发眼睛看到的地方的元素被点击的事件,这是为毛啊?UC浏览器都是正常的,微信最近更新作死吗,害我调整了好久,最好用top来代替margin-top了
贴上问题代码
<div class="pop_bg"></div>
<div class="pop_content">
<div class="pop_message">
<form id="baoming_from" name="" action="">
<p>请填写您的个人信息</p>
<ul>
<li><label>姓 名:</label><input type="text" name="name" myAttr="姓名"></li>
<li><label>联系电话:</label><input type="text" name="phone" myAttr="联系电话"></li>
<li><input type="button" value="报名" class="baoming_btn"></li>
</ul>
</form>
<div class="baoming_tip">
<div class="baoming_tip_box"><img src="data:images/xiaolian.jpg"><span>报名成功</span></div>
<button value="关闭" class="baoming_close">关闭</button>
</div>
</div>
</div>
下面CSS
/*公共弹窗样式*/
.pop_bg{ position: fixed; top:; left:; width: 100%; height: 100%; background-color: #343434; opacity: 0.15; z-index:; display: none;}
.pop_content{ width: 73.75%; padding-bottom:53.4375%; position: fixed; top: 15%; left: 50%; margin-left: -36.875%; margin-top: 0%; /*这里的margin-top用top代替了*/ background-color: #fff; z-index:; max-width: 470px; display: none;} .pop_message p{ text-align: center; margin-top: 10.42%; margin-bottom: 8.94%;}
#baoming_from{ /*display: none;*/}
.pop_message li{ margin-bottom: 5.1%;}
.pop_message label{ width: 33.05%; font-size: 25px; line-height: 1.8; text-align: right; margin-bottom:; font-weight:;}
.pop_message input{ width: 59.3%; margin-right:7.65%; line-height: 1.8; border: none; background-color: #f2f2f2; text-indent: 0.5em;}
#baoming_from .baoming_btn,.baoming_close{ display: block; color: #fff; margin-left: 33.05%; width: 31.915%; background-color: #da2737; line-height:; text-align: center; border-radius: 4px;}
.baoming_tip{ text-align: center; display: none;}
.baoming_tip_box{ margin-top: 21.28%; margin-bottom: 17.02%;}
.baoming_tip_box img{ margin-right: 6.8%; width: 15.11%;}
.baoming_tip_box span{ line-height: 70px;}
安卓手机微信页面position: fixed位置错误的更多相关文章
- error while obtaining ui hierarchy xml file...用 uiautomatorviewer 获取安卓手机软件页面时报错
Error while obtaining UI hierarchy XML file: com.android.ddmlib.SyncException: Remote object doesn't ...
- 部分安卓手机微信浏览器中使用XMLHttpRequest 2上传图片显示字节数为0的解决办法
前端JS中使用XMLHttpRequest 2上传图片到服务器,PC端和大部分手机上都正常,但在少部分安卓手机上上传失败,服务器上查看图片,显示字节数为0.下面是上传图片的核心代码: HTML < ...
- 关于苹果手机微信端 position: fixed定位top导航栏问题
在移动端,position: fixed定位一般不被识别,或者在ios系统中,获取input焦点时,会导致position: fixed的top失效,下面是我验证过的方法,大家可以试试.<!do ...
- 微信开发者工具获取位置错误(定位到北京)---调用wx.getLocation不出现获取定位提示
微信开发者工具获取不到自己当前的位置可能是以下几个原因: 1.调用wx.getLocation方法之后需要在app.json中声明permission字段 { "pages": [ ...
- 解决ios、微信移动端的position: fixed; 支持性不好的问题 && 禁用下拉暴露黑底的功能
解决ios.微信移动端的position: fixed; 支持性不好的问题 在chrome中的多个部分使用了position: fixed之后,都可以正常的布局,但是放在微信上却出现了不能正常显示的问 ...
- vux中x-input在安卓手机输入框的删除按钮(@on-click-clear-icon)点击没反应
首先看你自己的的版本好,如果在2.6.9以上,我是在git上找到的解决办法,记录一下,希望可以帮到有需要的小伙伴. 在项目中找 node_modules > vux > x-input & ...
- 【微信小程序】view顶部固定或底部固定 + scroll-view中的元素view也可以使用position:fixed;固定选中元素位置
1.顶端固定核心代码如下: <view class="page__hd" style="position:fixed; top:0;width: 750rpx;&q ...
- 移动端web页面使用position:fixed问题
在做移动端项目时,碰到一个很纠结的问题,头部固定的问题,一开始使用fixed,发现一系列的问题, 问题1:footer输入框 focus 状态,footer 被居中,而不是吸附在软键盘上部. 测试环境 ...
- 移动端web页面使用position:fixed问题总结
近期完成了一个新的项目(搜狐直播),其中又涉及到了 fixed(固定位置定位)的问题,在之前的文章<移动Web产品前端开发口诀——“快”>中已经阐述过我对 iScroll 的态度,所以在这 ...
随机推荐
- CodeForces 687C The Values You Can Make
$dp$,背包. $f[i][j][s]$表示前$i$个物品,凑出$j$价格的情况下,能否凑出$s$价格,$f[i][j][s]=1$表示能,否则不能. 转移很简单:如果$f[i][j][s]=1$, ...
- .net 在数据访问层中写一个DBhelper优化类
复习了在学校的时候做的WinForm端的一个学生信息管理系统,用的三层架构,看了一下里面的数据优化类 这个类是用来把对数据库的操作封装成静态方法,增删改查的时候直接调用这个类,减少项目里代码的冗余和方 ...
- hdu 5945 Fxx and game(单调队列优化DP)
题目链接:hdu 5945 Fxx and game 题意: 让你从x走到1的位置,问你最小的步数,给你两种走的方式,1.如果k整除x,那么你可以从x走一步到k.2.你可以从x走到j,j+t<= ...
- Scheme入门
目前选择的是DrRacket作为IDE,可以去网上搜索下载. 打开软件后,输入如下代码进行 helloworld #lang scheme ;The first program (begin (dis ...
- [其他]win7下chrome浏览器插件导出与导入
下载了某些插件,重装电脑怎么不备份,重装之后怎么再次使用,一文搞定! 导出crx格式备份文件 1.选择 自定义格式及控制 > 更多工具 > 扩展程序: 2.勾选"开发者模式&qu ...
- unity3d和php后台简单交互--一
unity3d开发时,用PHP作为后台是个不错的选择.对一些数据吞吐量不是很大的游戏,比如某个游戏的排名,登录等等,一般的php程序能够胜任了,并且php语言简单,开发容易对数据库尤其是mysql的支 ...
- 打开myeclipse2014的包资源管理器
网上查到的方法不太适用于myeclipse2014,我就自己试了一下下 结果是:windows->show view->general->project package 结果: 希望 ...
- UIPickerView 创建中国地区显示 省份 市
第一步初始化 UIPickerView *pickerview; //城市滚动表 NSDictionary *dict; //用于存储省份-城市的数据 NSArray *provinceArray; ...
- 移动互联网app
移动互联网app 2 App测试点 2.1安全测试 2.1.1软件权限 1隐私泄露风险:包括访问手机信息.访问联系人信息等 2对App的输入有效性校验.认证.授权.敏感数据存储.数据加密等方面进行检测 ...
- java中String类型的相关知识
String类方法整理说明: ·Length()用来求字符串的长度,返回值为字符串的长度: ·charAt()取该字符串某个位置的字符,从0开始,为char类型: ·getChars()将这个字符串中 ...