Shulou(Shulou.com)06/01 Report--

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

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.