 |
|
| |
| [HTML5]에서 frameset 대체 방법과 iframe 속성 |
|
|
  |
4년 전 |
# framset 대처 방법
<script type="text/javascript">
<!--
var webUrl = "http://www.naver.com";
var mobileUrl = "http://m.naver.com";
window.onload = function()
{
window.document.body.ownerDocument.clear();
var ifrmFlag = document.getElementById('ifrm');
if(ifrmFlag != null && ifrmFlag != "null" && ifrmFlag != "")
{
document.body.removeChild(ifrmFlag);
}
var iframe = document.createElement("iframe");
iframe.id = "ifrm";
iframe.src = webUrl;
iframe.width = "100%";
iframe.height = "100%";
iframe.frameBorder = "0";
iframe.scrolling = "no";
document.body.appendChild(iframe);
};
//-->
</script>
<body topmargin="0" leftmargin="0">
</body>
# iframe 속성 관련
seamless: 값은없다 이속성을 사용하면 문서에 그냥일반콘텐츠로나타난다.
예제)
<iframe seamless src="form.html" width="300" height="200"></iframe>
sandbox: 보안강화를 위해 추가된것이다. 값은 4가지가있다.
예제)
<iframe sandbox="allow-same-origin"></iframe>
<iframe sandbox="allow-top-navigation"></iframe>
<iframe sandbox="allow-forms"></iframe>
<iframe sandbox="allow-scripts"></iframe>
사라진 기능들
<iframe align="" frameborder="" longdesc="" marginheight="" marginwidth="" scrolling=""></iframe>
align은 img엘리먼트에서 설명했듯이 css로 대체, 마진 보더역시 마찬가지다.
옛부터 논의되던 scroll바역시 overflow로 css로 대체된다.
설명해주던 엘리먼트 longdesc는 a엘리먼트로 대체되었다.
<iframe src="inner.html" width="300" height="200"></iframe>
가로 세로 링크할 파일을 보여준예이다.
꼭 src가 아니더라도 콘텐트에 포함시킬려면 srcdoc를 사용하면된다.
하지만 지원되는 브라우저가 없다.
<iframe srcdoc="<p>모든부라우저에서 지원안함</p>" width="300" height="200"></iframe>
|
|
 추천 : 409 |
추천
목록
|
|
| |
|
