Hi!
I got a strange problem in IE7 with the font rendering after I apply a fade in effect using Spry.
At this page you can see a screenshot of the problem in IE7: http://mariuzzo.com/p/thescripts/ie7.JPG
It work on Firefox and Opera but no in IE7
Here is another screenshot in Firefox: http://mariuzzo.com/p/thescripts/ff.JPG
Did you know something about that?
And here is the source code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>The PlumbClub - Forum @ FIT</title>
<link href="include/css/site.css" rel="stylesheet" type="text/css" />
<link href="include/css/fit.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="include/js/SpryEffects.js"></script>
<script type="text/javascript" src="include/js/generateFadeFunction.js"></script>
<script type="text/javascript">
var elementsToFadeOut = ["flash_image"];
var elementsToFadeIn = ["flash_text"];
var fadeFunction = new Function(generateFadeFunction(elementsToFadeIn, 2000, 0, 100, elementsToFadeOut, 2000, 100, 40));
window.onload = function(){
fadeFunction.call();
};
</script>
<style type="text/css">
#flash_image, #flash_text{
width:826px;
height:439px;
}
</style>
</head>
<body>
<center>
<div class="container">
<div class="header"> <a href="index.htm"><img src="img/header_logo.png" alt="The Plumb Club" width="296" height="103" /></a>
</div>
<div class="menu">
<table id="menu" cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="item"><a href="member-list.htm">Members</a></td>
<td class="separator"></td>
<td class="item"><a class="selected" href="forum.htm">Plumb Club Forum @ FIT</a></td>
<td class="separator"></td>
<td class="item"><a href="lasvegas.htm">Las Vegas JCK Show</a></td>
<td class="separator"></td>
<td class="item"><a href="contactus.htm">Contact us</a></td>
<td class="separator"></td>
<td class="item"><a href="members/index.html">Member Login</a></td>
</tr>
</table>
</div>
<div id="content" class="content" style="background-color:#FFFFFF">
<table class="event" cellpadding="0" cellspacing="0" style="width:826px; height:462px">
<tr>
<td style="width:826px; height:23px; vertical-align:top">
<div class="sub-menu">
<ul id="subMenu">
<li class="nolast"><a href="about.htm" class="">About</a></li>
<li class="nolast"><a href="agenda.htm" class="">Agenda</a></li>
<li class="nolast"><a href="speakers.htm" class="">Speakers</a></li>
<li class="nolast"><a href="sponsors.htm" class="">Sponsors</a></li>
<li class="nolast"><a href="registration.htm" class="">Registration</a></li>
<li class="nolast"><a href="press.htm" class="">Press</a></li>
<li class="last"><a href="entertainment.htm" class="">Entertainment</a></li>
</ul>
</div>
</td>
</tr>
<tr>
<td style="width:826px; height:439px; vertical-align:top">
<div style="text-align:left">
<div id="flash_image"><img src="img/bg_fit.jpg" alt="" width="826" height="439" /></div>
<div id="flash_text">
<div style="float:left; width:664px; height:439px; overflow:hidden">
<div style="margin:58px 65px 0px 65px; width:534px">
<span class="title">Plumb Club Forum @ FIT</span><br />
<span class="slogan">The Future of Our Industry</span><br />
<br />
<span class="text">
The objective of the Forum is to position the Plumb Club as
the jewelry industry’s leading organization, defining and
spearheading the agenda of the jewelry market for the benefit
of its members – and the industry at large. The Forum will
attract ‘best in class’ attendees from all walks of the jewelry
economy: chain store buyers, better independents, miners,
labs, industry organizations, bankers and beyond.
</span>
</div>
</div>
<div id="sponsors" style="float:left">
<div id="title">
Sponsors
</div>
<div id="description">
</div>
</div>
</div>
</div>
</td>
</tr>
</table>
</div>
</div>
</center>
</body>
</html>