pointer-eventsĪpašums ļauj kontrolēt, kā HTML elementi atbildēt uz peles / touch notikumi - tostarp CSS karāšanās / aktīvām, klikšķiniet / pieskarieties notikumiem Javascript, un to, vai kursors ir redzams, vai ne.
.avoid-clicks ( pointer-events: none; )Kamēr pointer-eventsīpašumam ir vienpadsmit iespējamās vērtības, visas, izņemot trīs, ir rezervētas lietošanai ar SVG. Trīs derīgas jebkura HTMl elementa vērtības ir:
nonenovērš visas klikšķu, stāvokļa un kursora opcijas uz norādīto HTML elementuautoatjauno noklusējuma funkcionalitāti (noderīga lietošanai elementa bērnu elementiem arpointer-events: none;norādītoinheritizmantospointer-eventselementa vecāka vērtību
Kā parādīts iepriekš, galvenais izmantošanas gadījums pointer-eventsir ļaut klikšķa vai pieskāriena uzvedībai “iet cauri” elementam citam elementam, kas atrodas zem tā uz Z ass. Piemēram, tas būtu noderīgi grafiskiem pārklājumiem vai elementu paslēpšanai ar opacity(piemēram, rīku padomiem) un joprojām ļautu atlasīt tekstu zem tā esošajam saturam.
Apskates vietas
- “Rādītāju notikumu izmantošana CSS elementiem, kas nav SVG elementi, ir eksperimentāla. Agrāk šī funkcija bija daļa no CSS3 lietotāja saskarnes projekta specifikācijas, taču daudzu atklātu problēmu dēļ tā tika pārcelta uz CSS4. ” - Mozilla MDN
- "Ja elementam pievienojat klikšķu notikumu klausītāju, pēc tam noņemiet rādītāja notikumu stilu (vai mainiet tā vērtību uz automātisko, klikšķa notikums aktivizēs norādīto funkcionalitāti. Būtībā klikšķa notikums respektē rādītāja notikuma vērtību." - Deivids Volšs
Pārlūka atbalsts
Šie pārlūka atbalsta dati ir no Caniuse, kurai ir sīkāka informācija. Cipars norāda, ka pārlūks atbalsta šo un jaunākās versijas funkciju.
Darbvirsma
| Chrome | Firefox | IE | Mala | Safari |
|---|---|---|---|---|
| 4 | 3.6 | 11 | 12 | 4 |
Mobilais / planšetdators
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 2.1 | 3.2 |
Dažās pārlūkprogrammās atbalsts ir nedaudz dziļāks, ja to izmanto , piemēram, IE 9 to atbalsta.