如何透过上层div点击下层的元素解决方法
一、问题描述
笔者是在些一个登录界面时遇到这个问题的,需求是点击登录按钮出现登录悬浮框,初始化时登录悬浮框是display:none的,但笔者发现登录框那一块区域的input框无法响应点击时间,也无法获得焦点。
一般鼠标放在input框上是会变成编辑的横杠,input框也会获得焦点。
二、解决方案
对上层元素使用:
pointer-events: none;
这样点击事件就能穿透上层元素,
但若是你想让上层元素也能得到点击事件,又该怎么办呢?
只需要在你需要获得点击的上层元素子元素中加入:
pointer-events: auto;
即可!
如何透过上层div点击下层的元素解决方法的更多相关文章
- 使用PullToRefreshListView时遇到Item点击事件失效问题 解决方法
最近在自己的项目中使用到了以下开源项目: https://github.com/nanchen2251/pullToRefreshDemo 相关介绍博客如下: http://www.cnblogs.c ...
- JavaSwing输入对话框,点击取消抛出异常的解决方法
在做产品管理系统的时候,遇到一个问题: 在得到一个输入框对话框的时候 String textPrice = JOptionPane.showInputDialog("请输入要调整的价格增(减 ...
- ASP.NET Menu控件点击区域太小解决方法
ASP.NET自带的Menu控件点击区域比较小,基本就是文本范围和图片范围,在区域外虽然选择的项有颜色变化,但是这个时候点击是没有用的,体验不是很好 检查前台生成的HTML,是用td嵌套a标签,a标签 ...
- jquery.uploadify上传图片,点击保存按钮无法使用解决方法
用Chrome浏览器上传商品图片时,保存按钮无法点击,如下图 原因:Flash插件状态为禁止 或 询问(默认) 解决方法:将Flash插件状态改为允许,如下图
- ios 透过上层视图点击相应下方视图的点击事件
- (UIView*)hitTest:(CGPoint)point withEvent:(UIEvent *)event{ UIView *hitView = [super hitTest:point ...
- div+css的兼容性问题和解决方法
1. 默认的内外边距不同 问题: 各个浏览器默认的内外边距不同 解决: *{margin:0;padding:0;} 2. 水平居中的问题 问题: 设置 text-align: center ...
- Win7下IE11点击无反应的解决方法
平台:win7 sp1 32bit 问题:点击Internet Explorer在开始菜单.快捷栏的图标和安装目录下的程序均没有反应,鼠标在变成漏斗后恢复原状再无反应.但搜狗浏览器和360浏览器下使用 ...
- IE8下使用webuploader点击无反应的解决方法。
在IE8开头添加如下代码. <meta http-equiv="X-UA-Compatible" content="IE=edge"> 即可解决,亲 ...
- Android ListView的item点击无响应的解决方法
假设listitem里面包含button或者checkbox等控件,默认情况下listitem会失去焦点,导致无法响应item的事件,最经常使用的解决的方法 是在listitem的布局文件里设置des ...
随机推荐
- java IO 对象流 反序列化和序列化
例: 重点:需要序列化的对象必须实现Serializable接口 //需要序列化的对象 public class User implements Serializable { private Stri ...
- JavaEE互联网轻量级框架整合开发(书籍)阅读笔记(1):Mybatis和Hibernate概念理解
一.关键字说明: oop:面向对象 aop:面向切面 ioc:控制反转 orm:对象关系映射 pojo:数据库表映射的java实体类 二.常识说明:1.hibernate和mybatis都属于持久层. ...
- Schwartz kernel theorem施瓦兹核定理
In mathematics, the Schwartz kernel theorem is a foundational result in the theory of generalized fu ...
- 牌型总数——第六届蓝桥杯C语言B组(省赛)第七题
原创 牌型种数 小明被劫持到X赌城,被迫与其他3人玩牌.一副扑克牌(去掉大小王牌,共52张),均匀发给4个人,每个人13张.这时,小明脑子里突然冒出一个问题:如果不考虑花色,只考虑点数,也不考虑自己得 ...
- MongoDB整理笔记の安装及配置
1.官网下载 地址:http://www.mongodb.org/downloads mongodb-linux-x86_64-2.4.9.tgz (目前为止,64位最新版本) 2.解压 切换到下载目 ...
- Entity Framework 6 初体验
Entity Framework中有三种模式 Code First, Model First和Database First, Code First 是在EF4中新增的模式, 也跟NHibernate等 ...
- 【C#】is 和 as
看个例子: public class User { } public class Group { } class Program { static void Main(string[] args) { ...
- CentOS 网络操作
ifconfig:查看网卡信息 网卡配置文件位置: /etc/sysconfig/network-scripts/文件夹 nmtui:配置网卡 netstat -tlunp:查看端口信息 端口信息存储 ...
- EIP权限工作流平台-升级说明(2018-12-04)
表单生成器,文本框新增验证(默认验证及正则表达式) 列表查询支持复杂查询,支持文本框,下拉框,时间查询
- bootstrap的使用2
表单控件: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...