div가 swf보다 작더라도 div의 아래쪽에 swf를 맞 춥니 다?

저는 처음 29px 높이의 div 안에 270px의 swf를 포함 시켰습니다. 이 div는 페이지의 맨 아래를 따라 절대 위치에 놓이며 swf 파일의 정상 상태는 높이가 29px 밖에되지 않습니다. 사용자가 swf의 일부분을 가리키면 270px 높이가됩니다. 그 때 div의 높이를 변경하는 자바 스크립트를 통합하려고했습니다. 그러나 내가 겪고있는 문제는 swf 파일이 div의 맨 아래에 정렬되지 않는다는 것입니다. 내가 항상 <param name="salign" value="lb" />을 넣고 있다는 사실에도 불구하고 항상 맨 위에 정렬하는 것처럼 보인다. swf를 작은 div에 넣을 수 없으며 그 swf를 아래쪽에 정렬하고 위쪽에서 아래로 밀어 넣으십시오.div가 swf보다 작더라도 div의 아래쪽에 swf를 맞 춥니 다?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> 
    <head> 
     <title>egnewsTicker</title> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
     <style type="text/css" media="screen"> 
     html, body { height:100%; background-color: #ffffff;} 
     body { margin:0; padding:0; overflow:hidden; } 
     #flashContent { width:100%; height:29px; vertical-align:bottom; display:inline-block;} 
     </style> 
    </head> 
    <body> 
     <div id="flashContent"> 
      <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="100%" height="100%" id="egnewsTicker" align="bottom" vertical-align="bottom"> 
       <param name="movie" value="egnewsTicker.swf" /> 
       <param name="quality" value="high" /> 
       <param name="bgcolor" value="#ffffff" /> 
       <param name="play" value="true" /> 
       <param name="loop" value="true" /> 
       <param name="wmode" value="transparent" /> 
       <param name="scale" value="noscale" /> 
       <param name="menu" value="false" /> 
       <param name="devicefont" value="false" /> 
       <param name="salign" value="lb" /> 
       <param name="allowScriptAccess" value="sameDomain" /> 
       <!--[if !IE]>--> 
       <object type="application/x-shockwave-flash" data="egnewsTicker.swf" width="100%" height="100%"> 
        <param name="movie" value="egnewsTicker.swf" /> 
        <param name="quality" value="high" /> 
        <param name="bgcolor" value="#ffffff" /> 
        <param name="play" value="true" /> 
        <param name="loop" value="true" /> 
        <param name="wmode" value="transparent" /> 
        <param name="scale" value="noscale" /> 
        <param name="menu" value="false" /> 
        <param name="devicefont" value="false" /> 
        <param name="salign" value="lb" /> 
        <param name="allowScriptAccess" value="sameDomain" /> 
       <!--<![endif]--> 
        <a href="http://www.adobe.com/go/getflash"> 
         <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /> 
        </a> 
       <!--[if !IE]>--> 
       </object> 
       <!--<![endif]--> 
      </object> 
     </div> 
    </body> 
</html>

출처

2011-01-18 Ghost9

신속하고 더러운 방법으로이 문제를 해결하는 것 다음과 같이 두 번째 div에 swf를 래핑하는 것이 좋습니다.

<div id="hoverDiv" style="position: relative; overflow: hidden;"> 
<div id="wrapperDiv" style="position: absolute; bottom: 0px;"> 
<!-- SWF here --> 
</div> 
</div>

그러면 자바 스크립트로 "hoverDiv"의 높이를 조작 할 수 있습니다. SWF는 "hoverDiv"의 맨 아래에있는 "wrapperDiv"의 맨 위에 있어야하며 wrapperDiv에서 오버플로가 숨겨져 있어야합니다.

출처

2011-01-18 05:46:28 ebolyen

으로 업데이트되었습니다. 이것은 완벽하게 작동합니다. 이것은 최고의 웹 사이트와 같은 것입니다. – Ghost9

기꺼이 도와 드리겠습니다! – ebolyen

당신의 CSS에서이 시도 :

vertical-align:bottom;

를 문제가 해결되지 않으면, 이전 코드 후이를 추가

display:inline-block;

출처

2011-01-18 05:17:05 blake305

은 효과가없는 것으로 보인다. – Ghost9

질문을 편집하고 코드를 게시 하시겠습니까? – blake305

코드 – Ghost9

<div id="wrapperDiv" style="text-align:bottom;border:1px solid black;display:inline-block"> 
<!-- text goes here --> 
</div>

출처

2011-01-18 18:19:37 blake305

div가 swf보다 작더라도 div의 아래쪽에 swf를 맞 춥니 다?

답변

관련 문제