swfobject 오픈 소스 프로젝트로 진행중이다.
http://code.google.com/p/swfobject/

웹표준에 부합하지 않는 플래시를 좋아하진 않지만, 플래시를 어쩔 수 없이 써야하는 경우가 있다. 동적인 컨텐츠를 로드한다랄지 클라이언트에서 그렇게 원한다던지...

근데 Internet Explorer와 FireFox는 서로 다른 방식으로 HTML 태그(embed, object)를 사용한다. 그리고 그 파라미터는 복잡해서 매번 컨텐츠를 넣을때마다 외울 수도 없고 항상 찾아서 넣어야 한다. swfojbect를 사용하면 이러한 불편함을 줄일 수 있고, 태그를 잘못썼나 하는 고민에서 해방될 수 있다. 그리고 무엇보다 몇줄만 추가하면 되고 스펙에 정의된대로 뿌려줄 수 있기 때문에 매우 편리하다.


기존 플래시 가져오는 코드
<!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>SWFObject - step 3</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
    <script type="text/javascript" src="swfobject.js"></script> 
 
    <script type="text/javascript"> 
    swfobject.registerObject("myId", "9.0.115", "expressInstall.swf"); 
    </script> 
 
  </head> 
  <body> 
    <div> 
 
      <object id="myId" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="780" height="420"> 
 
        <param name="movie" value="myContent.swf" /> 
        <!--[if !IE]>--> 
        <object type="application/x-shockwave-flash" data="myContent.swf" width="780" height="420"> 
        <!--<![endif]--> 
          <p>Alternative content</p> 
        <!--[if !IE]>--> 
        </object> 
        <!--<![endif]--> 
      </object> 
    </div> 
  </body> 
</html>



swfobject 사용후 변경된코드

<!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>SWFObject dynamic embed - step 3</title> 
   
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
   
<script type="text/javascript" src="swfobject.js"></script> 
     
   
<script type="text/javascript"> 
    swfobject
.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0"); 
   
</script> 
 
 
</head> 
 
<body> 
   
<div id="myContent"> 
     
<p>Alternative content</p> 
   
</div> 
 
</body> 
</html>




swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0"); 

위 한줄로 쉽게 사용할 수 있다는게 매우 매력적이다.

저작자 표시 비영리 변경 금지
Posted by iHWAN

사용자가 입력하는 유동적인 데이터 처리시 띄어 쓰기를 하지 않아서 의도하지 않게 텍스트가 밀려나온다던지, 의도하지 않는 크기 이상으로 부모 컨테이너가 밀려 나오는 경우가 있다.

IE에서는 word-wrap: break-word;이라는 CSS가 있어서 이전부터 사용해왔었고, 많은 곳에서 이것만을 사용하고 프로그램 로직에서 스페이스를 주는 트릭을 사용한다.

그러나 FireFox나 Opera에서도 이를 해결할 수 있는 방법이 있는데, white-space를 이용하여서 줄바꿈이 가능하도록 하는 구문이다.

#wordwrap{
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}

저작자 표시 비영리 변경 금지
Posted by iHWAN