How to use the pointer-events attribute in css
Editor to share with you how to use the pointer-events attribute in css, I believe most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!
When an absolute positioning element covers a link or adds an element of an event handle, the default behavior (page jump) or element event of the link will not be triggered.
Firefox3.6+/Safari4+/Chrome now supports a css attribute called pointer-events. Use this attribute to determine whether you can penetrate an absolute positioning element to trigger some behavior of the following elements. It is as follows:
Copy the code
The code is as follows:
CSS:pointer-events
.overlay1 {
Width:80px
Height:20px
Background:gold
Position:absolute
Top:5px
Left:5px
Opacity:0.5
}
.overlay2 {
Width:80px
Height:20px
Background:gold
Position:absolute
Top:40px
Left:5px
Opacity:0.5
}
.pointer {pointer-events:none;}
_ window.onload = function () {
Document.getElementById ('chx'). Onclick = function () {document.getElementById (' a') .className
= "overlay1" + ((this.checked)? "pointer": ")
Document.getElementById ('b'). ClassName
= "overlay2" + ((this.checked)? "pointer": ")
}
}
SinaMail
