본문 바로가기

Local Oriented/HTML CSS JS

투명 플래시 z-index 가 적용되려면 object 사용시 param 에 name='wmode' value='transparent' 추가


가령, 페이스북의 Like 버튼을 달아야 하는데, 플래시가 z-index 레이어를 먹지 않을때 말이죠..
일단 생각할 수 있는 것은, 플래시를 div 태그로 감싸서 z-index 를 설정하는 것인데.. 이것도 적용이 되지 않을때가 있어요.
혹시, object 태그로 플래시를 호출할때..
<param name="wmode" value="transparent"> 를 사용했는지 확인해 보세요.
이거 넣으면 생각한 대로 될 겁니다. ^^.

그런데, 이렇게 해도 안 된다는 분.. 혹시 embed 쪽에도 넣으셨는지..
암튼 최종 결과물은 아래와 같습니다.

function setFlash(uri,width,height,bgcolor){
  document.writeln('<object id="idMovie" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,32,18" width="' +width+ '" height="' +height+ '">');
  document.writeln('<param name="allowScriptAccess" value="always" />');
  document.writeln('<param name="movie" value="' + uri + '" />');
  document.writeln('<param name="menu" value="false" />');
  document.writeln('<param name="quality" value="best" />');
  document.writeln('<param name="bgcolor" value="'+bgcolor+'" />');
  document.writeln('<param name="wmode" value="transparent" />');
  document.writeln('<embed id="idMovie2" src="' + uri + '" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="' + width + '"  height="' + height + '" wmode="transparent" />');
  document.writeln('</object>');
}

주의하세요.. ~.~
object 는 IE 에서 동작하고, embed 는 IE 이외의 웹브라우저에서 작동합니다.
wmode 도 object 와 embed 모두에 기술해야 하구요..


.Fine.