माउस होवर पर एचटीएमएल टेबल फ्लिकरिंग से बचें

Question

मुझे माउस होवर पर एचटीएमएल टेबल फ्लिकरिंग से बचने की जरूरत है। जब कोई पंक्ति को घुमाता है तो यह एक बटन दिखाता है, लेकिन तालिका थोड़ा अजीब लगती है।

यहाँ मेरी कोड http://jsfiddle.net/7nqLg/2/

Answer 1

उपयोग mouseenter और mouseleave बजाय है।

jQuery('.myRow').mouseenter(function() { 
    jQuery(this).find('div:first').css('visibility', 'visible'); 
}).mouseleave(function() { 
    jQuery(this).find('div:first').css('visibility', 'hidden'); 
}); 

और बजाय तत्व छुपाने का hidden को उसकी दृश्यता की स्थापना की और माउस पर पर visible, इस अस्थिर क्योंकि div कुछ स्थान घेरता है जब आप इसे दिखाने से बचने होगा। छुपा अपनी दृश्यता को अभी भी अंतरिक्ष पर कब्जा कर लेगा लेकिन प्रदर्शित नहीं किया जाएगा।

Demo

Answer 2

आप जब अतिरिक्त तत्वों संपर्क में हैं एक पंक्ति पर अधिकतम ऊंचाई मैच के लिए टीडी की डिफ़ॉल्ट ऊंचाई निर्धारित करने की आवश्यकता।

तो "myRow" टीडी के लिए सीएसएस 45 पिक्सल की न्यूनतम ऊंचाई की आवश्यकता है।

.myRow td { 
    height:45px; 
} 

Answer 3

td 2px की गद्दी बनाने .. या पंक्ति की ऊंचाई बढ़ाने - टीडी जो बटन रूप में अच्छी तरह पर 8px समायोजित कर सकते हैं .. इसके वर्तमान 8px, इसलिए की ऊंचाई में वृद्धि causeing पर पंक्ति ..