Hey all!

 Here's the deal, I have two divs being animated.  One is a background, which sets opacity at 80%, the other holds text and fades in over it.  The problem is that IE seems to ignore the transparency of the div background color tag.  FireFox has no problems.  Here is the source:

.popOver
{
    z-index: 2;
    width:0px;
    border: solid 1px #9e9e9e;
    background-color: #000000;
    overflow:hidden;
    display:none;
}
.popPnl
{
    z-index:2;
    color:White;
    font-family:Arial;
    overflow:hidden;
    display:none;
    padding: 5px 5px 5px 5px;

}

<asp:ImageButton ID="reg_ImgBut" runat="server" OnClientClick="return false;" ImageUrl="images/register.jpg"></asp:ImageButton>

<!-- popOver -->
        
        <div id="linkBack" class="popOver">
            <div style="float:right;opacity:0;filter:alpha(opacity=0);padding: 2px 1px 2px 1px;" id="btnCloseParent">
                <asp:LinkButton id="btnClose" runat="server" OnClientClick="return false;" ToolTip="Close">X</asp:LinkButton>
            </div>
        </div>
        
        <div ID="reg_pnl" class="popPnl">
            Hey! Stop messing up IE!
        </div>
        
        <script type="text/javascript" language="javascript">
            function Cover(bottom, top, ignoreSize) {
                var location = Sys.UI.Control.getLocation(bottom);
                top.style.position = 'absolute';
                top.style.top = location.y + 'px';
                top.style.left = location.x + 'px';
                if (!ignoreSize) {
                    top.style.height = bottom.offsetHeight + 'px';
                    top.style.width = bottom.offsetWidth + 'px';
                }
            }
        </script>
        <atlasToolkit:AnimationExtender runat="server">
            <atlasToolkit:AnimationProperties TargetControlID="reg_ImgBut">
                <Animations>
                    <OnLoad>
                        <OpacityAction AnimationTarget="reg_pnl" Opacity="0" />                        
                    </OnLoad>
                    <OnMouseOver>
                        <Sequence>
                            <EnableAction Enabled="false" />
                            <ScriptAction Script="Cover($('reg_ImgBut'), $('linkBack'));" />
                            <StyleAction AnimationTarget="linkBack" Attribute="display" Value="block"/>                            
                            <Parallel AnimationTarget="linkBack" Duration=".3" Fps="25">
                                <Move Horizontal="0" Vertical="-500" />
                                <Resize Width="500" Height="400" />
                                <Color AnimationTarget="linkBack" StartValue="#ffffff" EndValue="#000000" Property="style" PropertyKey="backgroundColor" />                                
                            </Parallel>
                            <FadeOut AnimationTarget="linkBack" MinimumOpacity=".8" Duration=".2"/>
                            <ScriptAction Script="Cover($('linkBack'), $('reg_pnl'), true);" />                            
                            <StyleAction AnimationTarget="reg_pnl" Attribute="display" Value="inline"/>                                                        
                            <FadeIn AnimationTarget="reg_pnl" Duration=".2"/>                            
                            <StyleAction AnimationTarget="reg_pnl" Attribute="height" value="auto" />
                            <Parallel Duration=".35">
                                <FadeIn AnimationTarget="btnCloseParent" MaximumOpacity=".9" />                            
                            </Parallel>
                        </Sequence>
                    </OnMouseOver>
                    </Animations>
            </atlasToolkit:AnimationProperties>
        </atlasToolkit:AnimationExtender>

Hi,

I haven't tried it, but you could replace the div with a Panel and add another AnimationExtender with an OpacityAction to it. 

I figured out what this is after some more research.  You have to add ForceLayoutInIE="false" to the FadeIn tag.

Hello

 I am experience the same issue with IE, when the text  fades in the background colour of the div is not transparent.  I tried the suggested ForceLayoutInIE="true" but this did not solve the problem.  Any ideas?  See below for my code.

      <!-- Fade in -->
     <asp:Panel id="fadeText" style="display:none; font-size:xx-large; left:185px; opacity:0; position:relative; top:-40px;" runat="server">
        Better Health starts with Better Communication
    </asp:Panel>
    <cc1:AnimationExtender ID="AnimationExtender1" runat="server" TargetControlID="fadeText">
         <Animations>
            <OnLoad>
                <Sequence>
                    <ScriptAction Script="InitialLoad();" />
                    <FadeIn Fps="30" AnimationTarget="fadeText" ForceLayoutInIE="true" />
                </Sequence>
            </OnLoad>
        </Animations>
    </cc1:AnimationExtender>

function InitialLoad()
{
    var home = document.getElementById("fadeText");
    home.style.opacity="0";
    home.style.display="block";
}

Thanks 

Aaron

 Hi I know this is an old thread.. but ive been wrestling with the animationextender and have had this exact issue.  Adding the ForceLayoutInIE="true" seems to have solved the transparency problem... well nearly... i now have a new problem...

All my page objects that I want to FadeIn yet remain transparant now do so which is great... but... any images that I want to FadeIn now appear almost like 'negative' versions... they all have dark edges... where there are meant to be subtle shadows and any opacity of the image itself has been lost... the images are all png-24 files.. but appear more like png-8 files.

I also note that the text on the pages since adding the animation Control looks bad... i guesss thats cause of the Clear type issue mentioned in this thread.. is there anything one can do about that?