Jquery animation: Making PNG Transparency fixed DIV animate opacity?

Question

Page in question: http://www.chrishanel.com/CMS

The following works in IE7, but doesn't in IE8:

HTML:

<div id="shell">
 <div id="quote">
  <!--[if IE]>
                    <div id="quoteie8" style="align:center;position:relative;opacity:1.00;text-align:center;height:144px;width:337px;margin:auto;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src=quote-trans.png);">
                    </div>
                    <![endif]-->
                    <![if !IE]>
                    <img src="images/quote-trans.png">
                    <![endif]>

Javascript:

$("div#quoteie8").animate( {opacity:.00}, 500);
$("div#quote").animate( {opacity:.00}, 500, function () { 
 $("div#shell").animate( {height:"444px"}, 1500);

Compatibility view has this working just fine, and I am not finding an answer as to how to make this animate work properly. Thanks.

Answer 1

You have typo in code in menuscript.js line 22 on http://www.chrishanel.com/CMS

$("div#quoteie8").animate( {alpha:.00}, 500);

replace with

$("div#quoteie8").animate( {opacity:.00}, 500);