क्या हम माउस इवेंट्स के लिए एक तत्व (div) पारदर्शी बना सकते हैं?

Question

मैं घटनाओं के लिए एक तत्व पारदर्शी बनाना चाहता हूं। अगर मैं उस पर क्लिक करता हूं, तो उसके पीछे के तत्व को उस घटना को निकाल दिया जाएगा।

Answer 1

pointer-events सीएसएस गुण का उपयोग करें ity: http://caniuse.com/#feat=pointer-events

Answer 2

हां। ऊपर दिए गए तत्व पर pointer-events:none; सेट करें।

यहाँ एक सरल उदाहरण है: जब मैं छवि पर क्लिक करें का चयन करें तत्व खोलता है:

div { 
 
    width: 14px; 
 
    height: 14px; 
 
    position:relative; 
 
    top: -18px; 
 
    left: 58px; 
 
    pointer-events: none; 
 
    background: url(http://lorempixel.com/14/14) no-repeat; 
 
}

<select> 
 
    <option value="value1">Value 1</option> 
 
    <option value="value2" selected>Value 2</option> 
 
</select> 
 
<div></div>

ब्राउज़र समर्थन अच्छा है (caniuse): IE के लिए छोड़कर - जहां यह केवल IE11

में समर्थित है

myElement { 
    pointer-events: none; 
} 

Do टिप्पणी ब्राउज़र compatibil:

Answer 3

या यदि आप इसे jQuery-Way (क्योंकि तर्क सीएसएस से बाहर होना चाहिए) करना चाहते हैं तो आप $("#foo").unbind("click"); का उपयोग कर सकते हैं।

आप यहाँ अधिक जानकारी प्राप्त कर सकते हैं:

http://api.jquery.com/unbind/