[jQuery] Fading Out a Flash Object - Strange Behavior

[orandov]

I am trying to fade out a Flash embed object and fade in regular Html.

For some reason the callback of the fadeout method gets fired multiple
times, before the fade out has finished. The result is that the Html
gets appended multiple times in the callback function and it blinks an
extra time.

This doesn't happen when I try fading regular Html.

Is the fadeout function not meant to work with flash?

Html:

<a id="HideFlash" href="#">Hide Flash</a>
<div id="FlashContainer" >
    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/
swflash.cab#version=9,0,0,0"
        width="100" height="50" id="TEST" align="middle">
        <param name="allowScriptAccess" value="sameDomain" />
        <param name="allowFullScreen" value="false" />
        <param name="movie" value="demo_banner.swf" />
        <param name="quality" value="high" />
        <param name="bgcolor" value="#ffffff" />
        <param name="wmode" value="transparent">
        <embed src="demo_banner.swf" quality="high"
wmode="transparent" bgcolor="#ffffff" width="100" height="50"
name="TEST"
            align="middle" allowscriptaccess="sameDomain"
allowfullscreen="false" type="application/x-shockwave-flash"
            pluginspage="http://www.macromedia.com/go/getflashplayer"; /
>
    </object>
</div>
<div id="RegularContent" >
<h1>Before Fade</h1>
</div>

JQuery:

 $('#HideFlash').click(function() {
        $('#FlashContainer *').fadeOut('slow', function() {

            $('#FlashContainer').append("<p style='display:
none;'>This is in the flash container</p>");
            $('#FlashContainer p').fadeIn('slow');
        });

        $('#RegularContent *').fadeOut('slow', function() {

        $('#RegularContent').append("<p style='display: none;'>This is
in the regular content after fade</p>");
        $('#RegularContent p').fadeIn('slow');
        });
    });