JQueryがFlashオブジェクトを適切にフェードアウトしないのはなぜですか？

Question

私はフラッシュ埋め込みオブジェクトをフェードアウトしようとしており、通常のHTMLでフェードしています。

何らかの理由で、フェードアウトが完了する前に、何らかの理由でフェードアウトメソッドのコールバックが複数回発生します。その結果、Htmlはコールバック関数で複数回追加され、余分な時間が点滅します。

通常のHTMLをフェードアウトさせようとすると、これは起こりません。

fadeout機能はフラッシュでは使用できませんか？

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'); 
     }); 
    }); 

Answer 1

私は問題が何であるかを正確に特定することはできませんが、私はここで働く例があります：私はそれはあなたのjQueryのセレクタでアスタリスク*かもしれないと思う http://jsbin.com/ayoqe

を？コンテナ自体を隠す代わりに、コンテナ内のすべてを隠そうとしているかのように見えます。

$(document).ready(function(){ 

    $('#RegularContent').hide(); // hide the regular content on load 

    $('#HideFlash').click(function() { 
     $('#FlashContainer').fadeOut('slow'); // fade out the flash container  
     $('#RegularContent').fadeIn('slow'); // fade in the regulare content 
     return false; 
    }); 

}); 


<a id="HideFlash" href="#">Hide Flash</a> 
<div id="FlashContainer" > 
    <object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/AlPqL7IUT6M&hl=en&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/AlPqL7IUT6M&hl=en&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object> 
</div> 
<div id="RegularContent"> 
<h1>Before Fade</h1> 
</div> 

私が正しく理解することを願っています。

Answer 2

私はjQueryのは、それが埋め込まれていても、サードパーティ製のマルチメディアオブジェクトの不透明度を操作するために装備されていないので、それはだと思います標準HTMLマークアップに変換します。

あなたの最善の策は、それの上に同じ次元の見えないDIVを配置してから、そのin/outをフェードアウトさせることだけかもしれません（しかし、これは純粋な推測です）。

Answer 3

@dalbaeb答えがおそらく最も良いですが、奇妙なことに、醜いエラー（dはjQuery 1.4で定義されておらず、eは1.5では未定義です。コードの塊がキュー処理に関係しているようです） 。

驚いたことに、jQuery 1.3で動作します。

Answer 4

私のソリューションは、まったく同じようには動作しませんが、fadIn（）でコールバック関数を使用してオブジェクトタグをdivに追加することでした。オブジェクトそのものが色あせていないことを意味しますが、divにイメージを追加してfadeInが完了したときにイメージをオブジェクトコードに置き換えることができます。

Answer 5

私は同じ問題を抱えています。 wmodeパラメータを "opaque"に変更すると動作しました。