I have the following HTML DIV which does not work using FadeIn in 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;
}
