Modal funktioniert nicht mit ie8

Question

Ich suche nach etwas Hilfe mit diesem. Ich habe Probleme mit einem Modal, das nicht korrekt in IE8 funktioniert. Kann mir jemand helfen oder mir sagen, wie man Modal erstellt, das in ie8 funktioniert? Ich bin zu irgendwelchen Vorschlägen usw. Danke Ihnen.

Hier mein Code:

HTML:

<a href="#openModal">Open Modal</a> 

<div id="openModal" class="modalDialog"> 
    <div> 
     <a href="#close" title="Close" class="close">X</a> 
     <h2>Modal Box</h2> 
     <p>This is a sample modal box that can be created using the powers of CSS3.</p> 
     <p>You could do a lot of things here like have a pop-up ad that shows when your website loads, or create a login/register form for users.</p> 
    </div> 
</div> 

CSS:

.modalDialog { 
    position: fixed; 
    font-family: Arial, Helvetica, sans-serif; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    background: rgba(0,0,0,0.8); 
    z-index: 99999; 
    opacity:0; 
    -webkit-transition: opacity 400ms ease-in; 
    -moz-transition: opacity 400ms ease-in; 
    transition: opacity 400ms ease-in; 
    pointer-events: none; 
} 

.modalDialog:target { 
    opacity:1; 
    pointer-events: auto; 
} 

.modalDialog > div { 
    width: 400px; 
    position: relative; 
    margin: 10% auto; 
    padding: 5px 20px 13px 20px; 
    border-radius: 10px; 
    background: #fff; 
    background: -moz-linear-gradient(#fff, #999); 
    background: -webkit-linear-gradient(#fff, #999); 
    background: -o-linear-gradient(#fff, #999); 
} 

.close { 
    background: #606061; 
    color: #FFFFFF; 
    line-height: 25px; 
    position: absolute; 
    right: -12px; 
    text-align: center; 
    top: -10px; 
    width: 24px; 
    text-decoration: none; 
    font-weight: bold; 
    -webkit-border-radius: 12px; 
    -moz-border-radius: 12px; 
    border-radius: 12px; 
    -moz-box-shadow: 1px 1px 3px #000; 
    -webkit-box-shadow: 1px 1px 3px #000; 
    box-shadow: 1px 1px 3px #000; 
} 

.close:hover { background: #00d9ff; } 

Answer 1

Ich denke, das Hinzufügen das Problem lösen:

-ms-transition: opacity 400ms ease-in; 

webkit transitors sind nicht gut von IE

check this für weitere Details unterstützt.