JQuery FadeIn не работает в Internet Explorer

Question

У меня есть следующий HTML DIV, который не работает с использованием FadeIn в IE:

$(".tip").fadeIn("slow"); /* Is not working in IE. */ 
$(".tip").show(); /* Works well in IE, that's weird. */ 



<div class="tip" style="width: 220px; display: none;"> 
      <div class="tip-header"> 
       <span><b>Title</b></span> 
       <div class="right close"><a href="javascript:void(0);">close</a> <img alt="" src="/Images/close-normal.png"/></div> 
      </div> 

      <div class="tip-content">EBody comes here.</div> 
     </div> 


.tip 
{ 
    display: block; 
    z-index: 99999; 
    position: fixed; 
    background-color: #ffffff; 
    -moz-box-shadow: 2px 2px 10px 2px rgba(0, 0, 0, 0.6); 
    -webkit-box-shadow: 2px 2px 10px 2px rgba(0, 0, 0, 0.6); 
    border:solid 1px #82C2FA; 
    -moz-border-radius: 8px; 
    -webkit-border-radius: 8px; 
} 

.tip-header 
{ 
    padding: 8px; 
    min-height: 10px; 
    -moz-border-radius-topleft: 8px; 
    -moz-border-radius-topright: 8px; 
    -webkit-border-radius-topright: 8px; 
    -webkit-border-radius-topleft: 8px; 
    background-color: #CFE6FD; 
    border-bottom: 1px solid #82C2FA; 
} 

.tip-header span 
{ 
    font-size: 14px; 
    color: #666666; 
} 

.tip-content 
{ 
    padding: 8px; 
    text-align: left; 
    font-size: 12px; 
} 

.close, .whats-this 
{ 
    cursor: pointer; 
} 

.close a 
{ 
    color: #085FBC; 
    text-decoration: none; 
} 

.close img 
{ 
    vertical-align: bottom; 
} 

Answer 1

Просто удалить $(".tip").show(); линию, это подразумевается в методе FadeIn().

Вот рабочий пример (IE8)

http://jsfiddle.net/Cxvdk/1/

Answer 2

Бен,
Я знаю, что $(".tip").show(); подразумевается и ненужной, но я хочу сказать вам это, что .Show работает пока .fadeIn нет. Я обновил код jsFiddle http://jsfiddle.net/Cxvdk/4/. Пожалуйста, проверь это. Я добавил внешний DIV, который вызвал проблему.

??

Answer 3

Удалить это с помощью CSS и он будет работать:

.section { дисплей: блок; }