2009-08-04 2 views
0

플래시 임베드 오브젝트를 페이드 아웃하고 일반 HTML로 페이드 인하려고합니다.JQuery가 플래시 객체를 제대로 사라지지 않는 이유는 무엇입니까?

fadeout 메서드의 콜백이 여러 번 발생하여 페이드 아웃이 완료됩니다. 그 결과, 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'); 
     }); 
    }); 

답변

2

나는 문제가 무엇인지 정확히 찾아 낼 수없는,하지만 난 여기에 동작하는 예제가 : 나는 당신의 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> 

희망과 올바르게 이해했으면합니다!

+0

플래시 객체 자체에 페이드를 적용하려고했습니다. 그래서 내가 별을 사용했다. FlashContainer에 페이드를 적용해야한다는 것이 맞습니다. 감사 – orandov

8

내가이 포함 된 경우에도, jQuery를 타사 멀티미디어 객체의 불투명도를 조작하기 위해 장착되지 않은 있기 때문에 생각 표준 HTML 마크 업으로

최상의 선택은 보이지 않는 DIV를 같은 크기로 배치 한 다음 그 입/출력을 페이드 아웃하는 것일 수 있습니다 (단 순전히 투기 임).

0

@dalbaeb 대답은 아마도 가장 좋은 것입니다.하지만 이상한 일은 추한 오류 (d는 jQuery 1.4에서는 정의되지 않았고 e는 1.5에서 정의되지 않았습니다. 코드 덩어리가 대기열 처리와 관련되어 있음) .

놀랍게도 jQuery 1.3에서 작동합니다!

1

내 솔루션은 정확하게 똑같은 방식으로 작동하지 않지만 fadIn()에서 콜백 함수를 사용하여 div에 개체 태그를 추가했습니다. 그것은 객체 자체가 희미 해지지 않는다는 것을 의미하지만, 당신이 div에 이미지를 추가 할 수 있다는 착각을 한 다음, fadeIn이 완료되면 이미지를 객체 코드로 대체합니다.

1

그래서 같은 문제가 발생합니다. wmode 매개 변수를 "opaque"로 변경하면 작동합니다.

관련 문제