如何透过上层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 ...
随机推荐
- linux 系统的ssh服务
ssh服务由服务端软件Openssh和客户端(常见的有ssh,SecureCRT,putty,xshell)组成,ssh服务默认使用22端口提供服务,它有两个不兼容的ssh协议版本,分别是1.x和2. ...
- 学习React中遇到的问题
1.执行eject后,再次启动项目报错 情景:使用create-react-app搭建了项目,启动没有问题,然后执行 $ yarn eject 暴露出webpack配置文件等,再次 $ yarn st ...
- 用css画的一个图形 空心正方形+四边四色
div{ width: 100px; height: 100px; border: 100px solid black; border-left-color:darkcyan; border-righ ...
- Head First HTML与CSS、XHTML (中文版).(Elisabeth Freeman) PDF扫描版
面对那些晦涩的html书你不禁要问:“难道要成为专家之后才能读懂这些?”那么,你应该选择<head first html与css.xhtml(中文版)>真正来学习html.这本书对你来说, ...
- asp.net微信内置浏览器下Session失效
问题记录:仅限安卓端微信内置浏览器,服务器集群设置了黏性Session,在Post请求时会强制走代理,导致出去的ip指向另一台服务器,黏性Session失效,用户状态无法保存. 目前想知道除了设置Se ...
- 《C#多线程编程实战》1.10 lock关键字
lock关键字是锁定资源用的. 书上的代码解释很好. /// <summary> /// 抽象类 加减法 /// </summary> abstract class Count ...
- 修改Tomcat主目录
在默认安装后,tomcat的主目录是webapps/root目录,如果我们想改变tomcat的主目录的话可以这样做: 1 %TOMCAT_HOME%/webapps/下直接创建,这种方法有一个缺点,就 ...
- PHP7 - MongoDB Driver 使用心得
php7 只能使用Mongodb driver来驱动mongodb. 使用Mongodb Driver连接数据库 刚开始使用Mongodb Driver的时候我是拒绝的.查看官方文档只看到一排的类和不 ...
- struts2的主要工作流程
struts2的框架结构图 struts2的主要工作流程: 1.客户端请求一个HttpServletRequest的请求,如在浏览器中输入http://localhost: 8080/bookcode ...
- Qt 学习之路 2(67):访问网络(3)
Qt 学习之路 2(67):访问网络(3) 豆子 2013年11月5日 Qt 学习之路 2 16条评论 上一章我们了解了如何使用我们设计的NetWorker类实现我们所需要的网络操作.本章我们将继续完 ...