In dit artikel zullen we ingaan op het gebruik van de CSS pointer-events eigenschap.
Wat is pointer-events Property?
CSS ' pointer-events ” eigenschap specificeert het gedrag van de aanwijzer/tik naar het HTML-element en of het geselecteerde element zal reageren door acties uit te voeren zoals zweven of klikken.
Hoe gebruik ik pointer-events-eigenschap?
In CSS kan de eigenschap pointer-events worden gebruikt om aanwijzeracties op bepaalde specifieke HTML-elementen in of uit te schakelen. De syntaxis van de eigenschap pointer-events wordt hieronder gegeven.
Syntaxis
pointer-events : geen | auto ;
In de genoemde syntaxis, ' auto ' is de standaardwaarde van de eigenschap pointer-events, en het maakt de aanwijzeractie naar een element mogelijk, en ' geen ” is totaal tegengesteld aan de auto; het schakelt aanwijzeractie op HTML-elementen uit.
Laten we verder gaan en een voorbeeld nemen om de eigenschap pointer-events te begrijpen.
voorbeeld 1
Geef in ons HTML-bestand een ankertag op met de tekst ' LinuxHint.io ” en plaats het in het lichaamsgedeelte.
HTML
< a href = “https://www.linuxhint.io/” > LinuxHint.io < / a >Nu gebruiken we de ' pointer-events ” eigenschap en ken het een waarde toe “ geen ”. Hierdoor wordt de aanwijzeractie op het element uitgeschakeld.
CSS
a {pointer-events : geen ;
}
Sla uw HTML-bestand op met de genoemde code en voer het uit met uw browser:
Laten we nog een voorbeeld nemen om de eigenschap pointer-events diepgaand te behandelen.
Voorbeeld 2
Stel de waarde van de eigenschap pointer-events in op ' auto ' deze keer. Het zorgt ervoor dat het element reageert als de aanwijzer zweeft of klikt. Desalniettemin is auto de standaardwaarde van de eigenschap pointer-events.
CSS
a {pointer-events : auto ;
}
Uitgang:
We hebben verschillende toepassingen van de eigenschap CSS pointer-events besproken.
Conclusie
Om de aanwijzeracties te beheren, kunnen we de CSS gebruiken ' pointer-events ' eigendom. De ' auto ” waarde is de vooraf gedefinieerde waarde van deze eigenschap; het maakt de acties over de HTML-elementen mogelijk. Wanneer de eigenschap pointer-events wordt gebruikt met de waarde ' geen ”, schakelt het de acties naar een specifiek element uit. Dit artikel heeft aangetoond hoe de eigenschap CSS pointer-events te gebruiken.