Δείκτες-εκδηλώσεις - CSS-Κόλπα

Η pointer-eventsιδιότητα επιτρέπει τον έλεγχο του τρόπου με τον οποίο τα στοιχεία HTML ανταποκρίνονται σε συμβάντα ποντικιού / αφής - συμπεριλαμβανομένων των CSS hover / ενεργών καταστάσεων, των συμβάντων κλικ / κτυπήματος στο Javascript και εάν ο δρομέας είναι ορατός ή όχι.

.avoid-clicks ( pointer-events: none; )

Ενώ η pointer-eventsιδιοκτησία παίρνει έντεκα πιθανές τιμές, όλες εκτός από τις τρεις προορίζονται για χρήση με SVG. Οι τρεις έγκυρες τιμές για οποιοδήποτε στοιχείο HTMl είναι:

none αποτρέπει όλες τις επιλογές κλικ, κατάστασης και δρομέα στο καθορισμένο στοιχείο HTML
autoεπαναφέρει την προεπιλεγμένη λειτουργικότητα (χρήσιμο για χρήση σε θυγατρικά στοιχεία ενός στοιχείου με pointer-events: none;καθορισμένο
inheritθα χρησιμοποιήσει την pointer-eventsτιμή του γονικού στοιχείου

Δείτε αυτό το στυλό!

Όπως αποδεικνύεται παραπάνω, η κύρια περίπτωση χρήσης pointer-eventsείναι να επιτρέπεται η συμπεριφορά κλικ ή βρύσης να "διέρχεται" από ένα στοιχείο σε άλλο στοιχείο κάτω από αυτόν στον άξονα Ζ. Για παράδειγμα, αυτό θα ήταν χρήσιμο για γραφικές επικαλύψεις ή απόκρυψη στοιχείων με opacity(π.χ. επεξηγήσεις εργαλείων) και θα εξακολουθεί να επιτρέπει την επιλογή κειμένου για το περιεχόμενο που βρίσκεται κάτω από αυτό.

Σημεία ενδιαφέροντος

«Η χρήση συμβάντων δείκτη στο CSS για στοιχεία εκτός SVG είναι πειραματική. Το χαρακτηριστικό ήταν μέρος της προδιαγραφής πρόχειρου CSS3 UI, αλλά, λόγω πολλών ανοιχτών ζητημάτων, έχει αναβληθεί στο CSS4. " - Mozilla MDN
"Αν προσθέσετε ένα πρόγραμμα ακρόασης συμβάντων κλικ σε ένα στοιχείο, αφαιρέστε το στυλ δείκτη-συμβάντων (ή αλλάξτε την τιμή του σε αυτόματο, το συμβάν κλικ θα ενεργοποιήσει την καθορισμένη λειτουργικότητα. Βασικά, το συμβάν κλικ σέβεται την τιμή συμβάντων δείκτη." - Ντέιβιντ Γουόλς

Υποστήριξη προγράμματος περιήγησης

Αυτά τα δεδομένα υποστήριξης του προγράμματος περιήγησης προέρχονται από την Caniuse, η οποία έχει περισσότερες λεπτομέρειες. Ένας αριθμός υποδεικνύει ότι το πρόγραμμα περιήγησης υποστηρίζει τη λειτουργία σε αυτήν την έκδοση και νεότερη.