SVG
Pekaren-händelser

Introduktion

ingen

det vanligaste fallet är att ställa in pekarhändelser på none att förhindra vissa former eller alla dina ritningar för att fånga mushändelser och att låta formerna under dem få emot händelserna.

Om du håller muspekaren över det område där den röda cirkeln överlappar den blå cirkeln får den blå cirkeln fortfarande mushändelser, eftersom pekarhändelser är inställda på none

<svg viewBox="0 0 150 100">
    <style>
        .target:hover{fill:green}
    </style>
    <circle class="target" cx="50" cy="50" r="50" fill="blue"/>
    <circle cx="100" cy="50" r="50" fill="red" pointer-events="none"/>
</svg> 

fylla

Ställa in pointer-events="fill" låter dig ta emot mushändelser på en form även om fyllningen är inställd på none

<svg viewBox="0 0 100 100">
    <style>
        circle:hover{fill:green}
    </style>
    <circle class="target" cx="50" cy="50" r="50" fill="none"/>
</svg>