如何透过上层div点击下层的元素

最新推荐文章于 2023-02-23 14:12:23 发布

邱志刚

最新推荐文章于 2023-02-23 14:12:23 发布

阅读量2.6k

点赞数 1

分类专栏： js技术 css 文章标签：如何透过上层div点击下层的元素

本文链接：https://blog.csdn.net/qq_42957741/article/details/85008141

版权

js技术同时被 2 个专栏收录

41 篇文章 1 订阅

订阅专栏

css

11 篇文章 0 订阅

订阅专栏

相信大家都会在开发中都会遇见这种问题，都为头层数的问题，下面这是一篇实例，你们可以研究一下。

<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<meta http-equiv="X-UA-Compatible" content="ie=edge" />
	<title>Document</title>
	<style type="text/css">
		.cancel{
			width: 500px;
			height: 500px;
			margin: 100px auto;
		}
		.aa{
			width: 100%;
			height: 100%;
			background: #c88111;
			z-index: 999999;
			opacity: 0.8;
			position: fixed;
			top: 0;
			left: 0;
			pointer-events: none;
		}
		#bb{
			width: 300px;
			height: 300px;
			position: relative;
			top: 50%;
			margin-top: -150px;
			margin: 0 auto;
			background: #FFFFFF;
		}
	</style>
</head>
<body style="background: #000000;">
	<div class="cancel">
		<div class="aa"></div>
		<div id="bb"></div>
	</div>
	<script type="text/javascript">
		var bb = document.getElementById("bb");
		bb.onclick = function (){
			alert(132)
		}
	</script>
</body>
</html>

pointer-events: none;   //重要这个属性

有没有感觉我帅的，来来，点击一下，留个评论。。。。

邱志刚

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
10
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录