how can we click the link behind the overlapping div.
css is
#apDiv1 {
position: absolute;
left: 38px;
top: 28px;
width: 221px;
height: 182px;
z-index: 1;
text-align:right;
}
#apDiv2 {
position: absolute;
left: 117px;
top: 13px;
width: 169px;
height: 210px;
z-index: 2;
}
and the html is
<div id="apDiv1"><a href="javascript:alert('link1');">Link 1</a></div>
<div id="apDiv2">
<p> </p>
<p><a href="javascript:alert('link 2');">Link 2</a></p>
</div>
Try this:
Add pointer-events:none;
to the upper div ( apDiv2
) and then:
#apDiv2 a {
pointer-events:auto;
}
To re-enable it for the link in your upper div.
Seems to work in FF at least.
Updated fiddle
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.