SVG => सूचक-घटनाओं

परिचय

pointer-events प्रॉपर्टी के साथ, आप नियंत्रित कर सकते हैं कि आपकी ड्राइंग का हिस्सा पॉइंटर घटनाओं पर प्रतिक्रिया करेगा।

कोई नहीं

सबसे आम उपयोग मामला कुछ घटनाओं या माउस की घटनाओं पर कब्जा करने के लिए अपने आरेखण को रोकने के लिए, और घटनाओं को प्राप्त करने के लिए उनके नीचे आकृतियों को none देने के लिए सूचक-घटनाओं को सेट करने के लिए है।

यदि आप उस क्षेत्र पर होवर करते हैं, जहां लाल वृत्त नीले वृत्त को ओवरलैप करता है, तो नीले वृत्त को अभी भी माउस ईवेंट प्राप्त होंगे, क्योंकि सूचक-ईवेंट none सेट 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>

भरण

pointer-events="fill" सेट करना pointer-events="fill" से आप माउस ईवेंट को एक आकार में प्राप्त कर सकते हैं, भले ही उसका भरण none से none सेट 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>

Modified text is an extract of the original Stack Overflow Documentation

के तहत लाइसेंस प्राप्त है CC BY-SA 3.0

से संबद्ध नहीं है Stack Overflow

SVG
सूचक-घटनाओं

खोज…

परिचय

कोई नहीं

भरण