html - hover is not working on child element -
मेरे पास div के नीचे div है
& lt; div id = "places" & gt; & Lt; div id = "h- dragbar" & gt; & lt; / div & gt; & Lt; / div & gt;
और नीचे के रूप में सीएसएस
#locations {ऊंचाई: 50px; चौड़ाई: 100%; स्थिति: रिश्तेदार; Z- इंडेक्स: -1; } # H- dragbar {पृष्ठभूमि-रंग: काला; चौड़ाई: 100%; ऊंचाई: 3px; स्थिति: पूर्ण; कर्सर: पंक्ति-आकार बदलना; नीचे: 0; Z- इंडेक्स: 99 9; } # एच-ड्रैगरबार: होवर {पृष्ठभूमि-रंग: नीला; }
लेकिन आईडी h-dragbar के साथ div पर होवर नहीं चल रहा है आप यहां कोड का परीक्षण कर सकते हैं।
मैं क्या कर रहा हूँ गलत? अग्रिम धन्यवाद।
नया उदाहरण jsFiddle में जो आपने प्रदान किया है, आप < कोड> z- अनुक्रमणिका का -1
मूल पैर यानी #locations
के लिए है, इसलिए आप अपने बच्चे div पर होवर फ़ंक्शन को करने में असमर्थ हैं # ज-dragbar
। आपको नकारात्मक z- अनुक्रमणिका
को #locations
पर निकालना होगा और फिर यह ठीक काम करेगा।
अपडेट:
मैंने आपके नवीनतम बेला की जांच की है और # v-dragbar zlinks
के लिए एक नकारात्मक z-index
का उपयोग करने की बजाय , आप उच्च z-index
के लिए # v-dragbar
का उपयोग कर प्राप्त कर सकते हैं, उदाहरण के लिए z- अनुक्रमणिका: 99 99
, और अपेक्षाकृत छोटा z- अनुक्रमणिका
के लिए #locations
, उदाहरण के लिए z-index: 9998
। यह पूरी तरह से इस तरह से काम करेंगे
बॉडी {चौड़ाई: 100%; ऊंचाई: 500 पीएक्स; } # वेपर {चौड़ाई: 100%; ऊंचाई: 100%; } # एक्सप्लोरर {चौड़ाई: 13%; न्यूनतम ऊंचाई: 100%; ऊंचाई: 100%; स्थिति: रिश्तेदार; बाईंओर तैरना; } # V-dragbar {पृष्ठभूमि-रंग: काला; ऊंचाई: 100%; सही नाव; चौड़ाई: 2px; कर्सर: रंग-आकार बदलना; Z- सूचकांक: 99 99; स्थिति: रिश्तेदार; } # H- dragbar {पृष्ठभूमि-रंग: काला; चौड़ाई: 100%; ऊंचाई: 2px; कर्सर: पंक्ति-आकार बदलना; स्थिति: पूर्ण; नीचे: 0; Z- इंडेक्स: 99 9; } # एच-ड्रैगरबार: होवर {पृष्ठभूमि-रंग: नीला; } # वी-ड्रैगरबार: होवर {पृष्ठभूमि-रंग: नीला; } # स्थान {ऊंचाई: 50%; चौड़ाई: 100%; स्थिति: रिश्तेदार; Z- इंडेक्स: 99 9 8 9; / * Imp * /}
& lt; div id = "wrapper" & gt; & Lt; div id = "explorer" & gt; & Lt; div id = "v-dragbar" & gt; & lt; / div & gt; & Lt; span शैली = "स्पष्ट: दोनों;" & gt; & lt; / span & gt; & Lt; div id = "स्थानों" & gt; & Lt; div id = "h- dragbar" & gt; & lt; / div & gt; & Lt; / div & gt; & Lt; div id = "डेटापॉइंट" & gt; & Lt; / div & gt; & Lt; / div & gt; & Lt; div id = "explorer" & gt; & Lt; / div & gt; & Lt; / div & gt;
Comments
Post a Comment