बूटस्ट्रैप बटन मोबाइल डिवाइस पर "अटक" हो जाते हैं

Question

जब भी मैं अपने मोबाइल डिवाइस (एंड्रॉइड) के साथ एक ट्विटर बूस्टर बटन पर बटन क्लिक करता हूं लेकिन बटन को अजीब स्टाइलिंग मिलती है जैसे माउस अभी भी खत्म हो गया है और जब तक मैं किसी अन्य पर क्लिक नहीं करता तब तक रिलीज़ नहीं होता तत्व। यह एक तत्व पर लागू सक्रिय वर्ग नहीं है।

यह सूक्ष्म लेकिन बहुत कष्टप्रद है, खासकर जब मैं बटन वे न दिखाने जब तक मैं एक अलग तत्व पर क्लिक करने के शैलियाँ लागू करने का प्रयास करें।

एक मोबाइल डिवाइस पर http://twitter.github.com/bootstrap/base-css.html#buttons के लिए जा रहा कोशिश करो और एक बटन पर क्लिक करें आप मैं क्या मतलब

मैं jQuery के साथ घटनाओं के सभी प्रकार के ट्रिगर करने की कोशिश की लेकिन कुछ भी काम किया देखेंगे, यह एक टुकड़ा के अंत में मेरे पास है है मेरी जावास्क्रिप्ट

$(document).on('tapclick', '.btn', function() { 
      $(this).blur(); 
      $(this).trigger('mouseup'); 


     }); 

और मंडराना

.btn a:hover,.btn a:link,.btn a:visited,.btn a:active{ 
text-decoration: none !important; 
cursor: default !important; 
background-color: transparent !important; 
background-image: none !important; 
} 

Answer 1

पर सीएसएस शैली को अधिभावी की कोशिश की मैं पर बटन के एक वर्ग को जोड़ने के द्वारा इस समस्या को ठीक touchend घटना और फिर डिफ़ॉल्ट बूटस्ट्रैप पृष्ठभूमि स्थिति ओवरराइडिंग।

जावास्क्रिप्ट:

$("button").on("touchstart", function(){ 
    $(this).removeClass("mobileHoverFix"); 
}); 
$("button").on("touchend", function(){ 
    $(this).addClass("mobileHoverFix"); 
}); 

सीएसएस:

.mobileHoverFix:hover, 
.mobileHoverFix.hover{ 
    background-position: 0 0px; 
} 

Answer 2

तुम सिर्फ मोबाइल के लिए विकसित कर रहे हैं तो आप बस मंडराना सीएसएस पूरी तरह, उदाहरण के लिए रद्द कर सकते थे:

.btn:hover { 
    background-color: inherit; 
}