bug描述

在安卓浏览器中,有一个在页面底部的弹出层表单,样式如下:

.popup {

    position: absolute;
bottom: 0;
}

当在这个弹出层输入内容,键盘自动弹出,弹出层的bottom值会改变成键盘的高度,有可能使输入框超出屏幕的高度。

bug解决

给弹出层添加一个高度

.popup {
position: absolute;
bottom: 0;
max-height: 80%;
}

【bug】安卓浏览器键盘输入改变弹出层的定位的更多相关文章

  1. ios11,弹出层内的input框光标错位 键盘弹出时,输入信息,光标一直乱跳

      之前开发了一个微信项目,维护期中苹果手机突然出现光标错位现象,经过排查,发现是最新的ios11系统的锅. 具体情况:弹出层使用position: fixed:弹出层内附带input/textare ...

  2. 使用Jq实现弹出层

    对于前端程序员来说,弹出层是经常用到的,下面我叫大家如何用实现JQuery实现弹出层的效果,代码如下: CSS:弹出层的效果 .mask { position: absolute; top: 0px; ...

  3. 微信内置浏览器浏览H5页面弹出的键盘遮盖文本框的解决办法(转)

    最近在做微信公众号的内嵌页面,发现点击输入框时键盘盖住文本框,找到一段代码解决了这个问题. iOS和android手机都已亲测,需要的可以直接拷贝到代码中使用. js代码如下: $(function ...

  4. 修改某个UITextField的键盘的返回键类型以及监听键盘的高度变化,取到键盘动画退出弹出的时间,一起随着键盘顶出来或者压下去,

    1.修改某个UITextField的键盘的返回键类型: [_bottomTextView setReturnKeyType:UIReturnKeyDone]; 1.1.textFied点击return ...

  5. [bug]小程序弹出层滚动穿透问题修复

    如题,解决方案有两种: 1.如果弹出层没有滚动事件,就直接在蒙板和弹出层上加 catchtouchmove;(方便快捷) <template name="popup-modal&quo ...

  6. LODOP内嵌挡住浏览器的div弹出层

    首先,做一个简单的div弹出层用于测试,该弹出层的介绍可查看本博客另一篇博文:[JS新手教程]浏览器弹出div层 然后加入LODOP内嵌,LODOP可以内嵌,C-LODOP不能内嵌,可以在IE等浏览器 ...

  7. React native 的弹出层(输入)效果

    /*弹出层测试*/ import React,{Component} from 'react'; import { StyleSheet, View, Image, Text, TouchableOp ...

  8. 火狐浏览器高度&制作简单万年历&弹出层

    浏览器高度: FireFox中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高 ...

  9. 点击图片或者鼠标放上hover .图片变大. 1)可以使用css中的transition, transform 2) 预先设置一个 弹出div. 3)弹出层 alert ; 4) 浏览器的宽度document.documentElement.clientWidth || document.body.clientWidth

    变大: 方法一: 利用css属性. 鼠标放上 hover放大几倍. .kecheng_02_cell_content img { /*width: 100px; height: 133px;*/ wi ...

随机推荐

  1. datatables分页

    一万条以下 var dataTables = $('#dataTables').DataTable(); 一万条以上 var dataTables = $('#dataTables').DataTab ...

  2. c++11多线程学习笔记之二 mutex使用

    // 1111111.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <iostream> #include ...

  3. java实现网站paypal支付功能并且异步修改订单的状态

    java实现网站paypal支付功能并且异步修改订单的状态:步骤如下 第一步:去paypal的官网https://www.paypal.com注册一个个人账号,在创建沙箱测试账号时需要用到 第二步:p ...

  4. 2018.09.16 codeforces1041C. Coffee Break(双端队列)

    传送门 真心sb题啊. 考场上最开始看成了一道写过的原题... 仔细想了一会发现看错了. 其实就是一个sb队列. 每次插入到队首去就行了. 代码: #include<bits/stdc++.h& ...

  5. 着重基础之—MySql 不能遗忘的索引操作

    着重基础之—MySql 不能遗忘的索引操作 关于MySql索引的基础知识我就不在这里写了,我不太想当信息的搬运工. 技巧分享:Workbench 作为一款专为MySQL设计的ER/数据库建模工具.除了 ...

  6. Repository模式中,Update总是失败及其解析(转)

    出处:http://www.cnblogs.com/scy251147/p/3688844.html 关于Entity Framework中的Attached报错的完美解决方案终极版 前发表过一篇文章 ...

  7. DEVEXPRESS 破解方法

    Devexpress 是.net的一个非常好用的插件.能够轻松的帮你实现一个非常炫的UI,无论是C#的Winform还是ASP.NET的网站. 鄙人这两天在用DEVEXPRESS的过程中发现在网上并未 ...

  8. 软件工程网络15个人作业4(201521123010徐璐琳)——alpha阶段个人总结

    一.个人总结 1. 总结自己的alpha 过程: 经过了两周的ALPHA阶段,在这之中学习到了很多,因为最开始其实是有抱着一种应付的.将就着的心理去做这个小程序,但是在完成项目的过程中,有老师和助教一 ...

  9. Android AppCompat 需要 API 级别 11

    为了兼容性使用 AppCompat 支持库.现在我试图override AppCompat 中的一些项来建立自己的Theme,在values文件下的style.xml里添加如下内容. <!-- ...

  10. hdu2041

    题目 这道题以前也看到过,但是没有写出来,我刚开始以为用循环遍历一边就可以了,结果我错了,没想到是用的斐波拉契推出来的,用的是递推的思想. 站在楼梯的第n级想一下,前一步是从哪里来的,问题就清楚了. ...