कैसे करें: आईई में सक्रिय राज्य का काम?

Question

मेरे पास मेरे एचटीएमएल फॉर्म में एक बटन है और इसे सीएसएस का उपयोग करके क्लिक किए जाने पर इसकी पृष्ठभूमि छवि को बदलने की जरूरत है। यह एफएफ में सही काम करता है लेकिन ऐसा लगता है कि आईई :active राज्य का समर्थन नहीं करता है।

यहाँ मेरी कोड है:

HTML:

<button class='button'>Click Me</button> 

सीएसएस:

.button { 
    width: 118px; 
    height: 33px; 
    background: url(/images/admin/btn.png) no-repeat center top; 
    border: none; 
    outline: none; 
} 
.button:active { 
    background-position: center bottom; 
} 

Answer 1

यह IE के पुराने संस्करणों में एक ज्ञात बग है (मुझे लगता है कि वे IE8 में इसे हल) । मैं जावास्क्रिप्ट के साथ आमतौर पर इसे हल करता हूं (साथ ही संबंधित "होवर" समस्या)। मैं कक्षा को हटाने के लिए एक अतिरिक्त वर्ग ("बटन-सक्रिय" जैसे कुछ "और" माउसअप "सेट करने के लिए" mousedown "तत्व में दो ईवेंट हैंडलर संलग्न करता हूं।

$('.button').mousedown(function() { $(this).addClass('button-active'); }); 
$('.button').mouseup(function() { $(this).removeClass('button-active'); }); 

फिर, सिर्फ इतना है कि वर्ग सीएसएस नियम के, जोड़ सकते हैं ताकि तरह: jQuery में यह कुछ इस तरह होगा

.button:active, .button-active { 
    background-position: center bottom; 
} 

एक छोटी सी बदसूरत, हाँ, लेकिन क्या आप उम्मीद करते हैं - यह इंटरनेट एक्सप्लोरर है। यह सुंदर नहीं हो सकता है।