如何透过上层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 ...
随机推荐
- Graph cut使用方法
下载:http://www.wisdom.weizmann.ac.il/~bagon/matlab.html 1. 运行compile_gc.m 2.运行gc_example.m(必须同目录吗?!) ...
- 【学习】CodeUi
关于这个,博客园里有很多初级的教程,我是看这篇: http://www.cnblogs.com/luminji/archive/2010/11/18/1880452.html 初学的可以跟着这个做一边 ...
- Google Earth 8.0
前几天有看到全新的Google Earth 8.0升级,刚好适合自己的手机应用.Google Earth 8.0 官方下载:https://play.google.com/store/apps/det ...
- JavaScript中创建自定义对象的方法
本文内容参考JavaScript高级程序设计(第3版)第6章:面向对象的程序设计 ECMA-262中把对象定义为:“无序属性的集合,其属性可以包含基本值.对象或者函数.”我所理解的就是对象就是一个结构 ...
- 动态内存分配存在的问题(内存空洞)------c++程序设计原理与实践(进阶篇)
new的问题究竟在哪里呢?实际上问题出在new和delete的结合使用上.考察下面程序中内存分配和释放过程: while(1){ Big* p=new big; //...... Small* n1= ...
- django自定义rbac权限组件(二级菜单)
一.目录结构 二.表结构设计 model.py from django.db import models # Create your models here. class Menu(models.Mo ...
- 老男孩Day18作业:后台用户管理
一.作业需求: 1.用户组的增删改查 2.用户增删该查 - 添加必须是对话框 - 删除必须是对话框 - 修改,必须显示默认值 3.比较好看的页面 二.博客地址:https://www.cnblogs. ...
- \\.\Global\vmx86: 系统找不到指定的文件
使用vmware虚拟机时出现如下的错误: vmware安装无法打开内核设备 \\.\Global\vmx86: 系统找不到指定的文件 解决办法: 新建文件,将下面的代码拷贝进去: @Echo Off ...
- AR资料汇总学习
ARKit 从入门到精通 http://www.chinaar.com/ARKit/5210.html ARKit 框架的学习 http://blog.csdn.net/biangabiang/art ...
- IntelliJ IDEA(Android Studio)设置代码的快捷编辑模板Live Templates
1.file---->setttings 2.editor--->live template 3.点击右侧的+ 4.设置模板 注意:Abbreviation为代码模板的缩写.