pointer-events | Codingku

Properti pointer-events digunakan untuk mengontrol dalam kondisi apa elemen grafis tertentu dapat menjadi target dari peristiwa pointer.

Properti pointer-events dapat memiliki banyak nilai yang berlaku untuk elemen SVG, tetapi hanya tiga dari nilai ini yang berlaku untuk elemen HTML.

Ketika pointer-events digunakan pada elemen-elemen HTML, properti ini dapat menentukan apakah suatu elemen dapat merespon atau tidak peristiwa mouse.

Properti ini dapat digunakan untuk mencegah klik, status(status CSS aktif, fokus, dan hover), dan tindakan kursor.

Kamu dapat meminta elemen merespon peristiwa pointer (auto), atau mencegahnya melakukan hal itu (none).

Jika kamu mencegahnya merespon peristiwa penunjuk, elemen yang di bawahnya akan menjadi target dari peristiwa ini.

Jika kamu mengklik elemen tersebut, elemen di bawahnya akan menerima event klik itu.

Hal yang sama berlaku untuk kursor dan tindakan kursor lainnya.

Misalnya, kamu akan dapat memilih teks dalam elemen yang diposisikan di bawah elemen dengan pointer-events: none.

CSS Syntax

pointer-events: auto | none;

JavaScript Syntax

object.style.pointerEvents="none"

Default value:	auto
Inherited:	ya
Animatable:	tidak Read about animatable
Version:	CSS3

Attribute Value

default pointer-events: auto;

Elemen bereaksi terhadap peristiwa pointer, seperti: :hover (mengarahkan) atau click.

pointer-events: none;

Elemen tidak bereaksi terhadap peristiwa penunjuk, seperti: :hover atau click. Akibatnya, elemen yang ada di belakang dapat diakses.