U ovom ćemo tekstu razraditi kako koristiti svojstvo CSS pointer-events.
Što je svojstvo događaja pokazivača?
CSS “ pokazivač-događaji ” Svojstvo određuje ponašanje pokazivača/dodirivanja prema HTML elementu i hoće li odabrani element odgovoriti izvođenjem radnji kao što su lebdenje ili klik.
Kako koristiti svojstvo pointer-events?
U CSS-u, svojstvo pointer-events može se koristiti za omogućavanje ili onemogućavanje radnji pokazivača na nekim određenim HTML elementima. Sintaksa svojstva pointer-events je dana u nastavku.
Sintaksa
pokazivač-događaji : nikakav | auto ;
U spomenutoj sintaksi, ' auto ” je zadana vrijednost svojstva pointer-events i omogućuje radnju pokazivača prema elementu, i “ nikakav ” potpuno je suprotno od auta; onemogućuje djelovanje pokazivača na HTML elemente.
Idemo naprijed i uzmimo primjer da bismo razumjeli svojstvo događaja pokazivača.
Primjer 1
U našoj HTML datoteci navedite oznaku sidra s tekstom ' LinuxHint.io ” i postavite ga unutar dijela tijela.
HTML
< a href = “https://www.linuxhint.io/” > LinuxHint.io < / a >Sada ćemo koristiti ' pokazivač-događaji ' svojstvo i dodijelite mu vrijednost ' nikakav ”. Ovo će onemogućiti radnju pokazivača na elementu.
CSS
a {pokazivač-događaji : nikakav ;
}
Spremite svoju HTML datoteku sa spomenutim kodom i pokrenite je pomoću preglednika:
Uzmimo još jedan primjer kako bismo detaljnije pokrili svojstvo događaja pokazivača.
Primjer 2
Postavite vrijednost svojstva događaja pokazivača na ' auto ' ovaj put. Natjerat će element da reagira na prelazak pokazivača ili klik. Bez obzira na to, auto je zadana vrijednost svojstva pointer-events.
CSS
a {pokazivač-događaji : auto ;
}
Izlaz
Pokrili smo različite upotrebe svojstva CSS pointer-events.
Zaključak
Za kontrolu radnji pokazivača, možemo koristiti CSS ' pokazivač-događaji ” vlasništvo. ' auto ” vrijednost je unaprijed definirana vrijednost ovog svojstva; omogućuje radnje nad HTML elementima. Kada se svojstvo pointer-events koristi s vrijednošću ' nikakav ”, onemogućuje radnje prema određenom elementu. Ovaj zapis je pokazao kako se koristi svojstvo CSS pointer-events.