जेड-इंडेक्स आईई 8 में टूटा हुआ है?

यह कोड IE8 को छोड़कर, मैंने कोशिश की हर दूसरे ब्राउज़र में काम करता है।जेड-इंडेक्स आईई 8 में टूटा हुआ है?

आईई 8 जेड-इंडेक्स को अनदेखा करता है - और पॉप-अप पॉप-अंडर बन जाता है।

यह सही जगह पर है, बस थंबनेल के नीचे प्रस्तुत करता है।

कोई भी?

धन्यवाद!

HTML:

<a class="thumbnail" href="#thumb"> 
    <img src="comic_a3_thumb.jpg" height="300" width="212" border="0" 
     style="float:right; margin-top:10px;margin-bottom:10px;" 
     alt="description" /> 
    <span> 
     <img src="/images/comic_a3_popup.jpg" /> 
    </span> 
</a>

सीएसएस:

.thumbnail{ 
    position: relative; 
    z-index: 0; 
} 

.thumbnail:hover{ 
    background-color: transparent; 
    z-index: 50; 
} 

.thumbnail span{ /*CSS for enlarged image*/ 
    position: absolute; 
    background-color: lightyellow; 
    padding: 5px; 
    left: 0px; 
    border: 1px dashed gray; 
    visibility: hidden; 
    color: black; 
    text-decoration: none; 
} 

.thumbnail span img{ /*CSS for enlarged image*/ 
    border-width: 0; 
    padding: 2px; 
} 

.thumbnail:hover span{ /*CSS for enlarged image on hover*/ 
    visibility: visible; 
    top: -140px; /*position where enlarged image should offset horizontally */ 
    left: -500px; 
}

स्रोत

2009-08-17 Anonymous

सरल जवाब एक z-index मूल्य कि span का मंडराना राज्य के लिए .thumbnail:hover मूल्य से अधिक है जोड़ना है।

.thumbnail:hover span{ /*CSS for enlarged image on hover*/ 
    visibility: visible; 
    top: -140px; /*position where enlarged image should offset horizontally */ 
    left: -500px; 
    z-index: 51; 
}

स्रोत

2009-08-17 20:36:08

धन्यवाद - समस्या हल करती है! –

अगर मैं तुम्हें सही ढंग से समझ, आप span तत्व थंबनेल के रूप में चिह्नित ऊपर दिखाना चाहते हैं। आपने span तत्व के लिए z-index निर्दिष्ट नहीं किया है।

 
<!DOCTYPE HTML> 
<html> 
<head> 
    <meta http-equiv="Content-type" content="text/html; charset=UTF-8" /> 
    <title>Pop-up Test</title> 
    <style type="text/css"> 
     #vbox { 
      border: 1px solid black; 
      height: 200px; 
      position: relative; 
      width: 200px; 
      z-index: 0; 
     } 

     #vbox:hover #hbox { 
      display: block; 
     } 

     #hbox { 
      border: 1px solid blue; 
      display: none; 
      height: 200px; 
      left: 50px; 
      position: relative; 
      top: 50px; 
      width: 200px; 
      z-index: 1; 
     } 
    </style> 
</head> 
<body> 
    <div id="vbox"> 
     <p>Hover over this box to show a hidden "pop-up".</p> 
     <p id="hbox">This box is a pop-up.</p> 
    </div> 
</body> 
</html>

स्रोत

2009-08-17 20:46:08

तरह से इस समस्या को हल करने के लिए इस तरह थंबनेल छवि के लिए एक वर्ग को जोड़ने के द्वारा किया जाता है:: यहाँ एक काम उदाहरण है

.thumbnail:hover img.thumb {z-index:-50; position:relative;}

स्रोत

2010-01-06 15:52:02 Chris

अपने पृष्ठ के सिर में इन पंक्तियों के रखो

<!--[if IE]> 
    <style> 
      #your_faulty_div{ 
      background-color:#000; /*any color it doesn't matter*/ 
     filter: alpha(opacity=0); 
     } 
     </style> 
<![endif]-->

your_faulty_div वह div है जो आईई जेड-इंडेक्स बग के कारण गलत व्यवहार कर रहा है।

चिकनी काम करता है, मैं इसे अपनी सभी परियोजनाओं में उपयोग करता हूं जहां मैंने तत्वों को ओवरलैपिंग किया है।

स्रोत

2010-05-15 08:02:46

आप गलत व्यवहार का क्या मतलब है? क्या यह div जो शीर्ष पर जाना है, या पीछे जाने वाला माना जाता है? इसे 0 की अस्पष्टता देने से यह सब एक साथ छिपाएगा? मुझे खुद को एक ही मुद्दे के साथ समस्या है। धन्यवाद! – cederlof

जेड-इंडेक्स आईई 8 में टूटा हुआ है?

उत्तर

संबंधित मुद्दे