행복얼라이언스 iframeresizer 활용
2018. 4. 16. 11:47
iframeResizer.contentWindow.min.js
iframeresizer 활용
행복얼라이언스
부모창
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko">
<head>
<title>행복얼라이언스</title>
<meta name="viewport" content="width=1100, user-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="title" content="행복얼라이언스" />
<meta name="robots" content="all">
<meta name="keyword" content="행복 얼라이언스, 행복얼라이언스, 행복 alliance, 행복alliance, 행복 ALLIANCE, 행복ALLIANCE" />
<meta name="description" content="개인과 기업이 함께 사회문제를 해결하는 사회공헌 플랫폼 행복Alliance" />
<meta property="fb:app_id" content="1193195260758856" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://happyalliance.org/">
<meta property="og:title" content="행복얼라이언스" />
<meta property="og:description" content="개인과 기업이 함께 사회문제를 해결하는 사회공헌 플랫폼 행복Alliance" />
<meta property="og:image" content="http://happyalliance.org/view/images/common/share_image.jpg" />
<meta property="og:site_name" content="행복 얼라이언스, 행복얼라이언스, 행복 alliance, 행복얼라이언스, 행복 ALLIANCE, 행복얼라이언스" />
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
<link rel="stylesheet" type="text/css" href="http://happyalliance.org/view/common/css/common.css" />
<link rel="stylesheet" type="text/css" href="http://happyalliance.org/view/common/css/swiper.css" />
<script src="//developers.kakao.com/sdk/js/kakao.min.js"></script>
<script type="text/javascript" src="http://happyalliance.org/view/common/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="/iframeResizer.min.js"></script>
</head>
<body>
<div id="wrap">
<div id="header">
<div class="inner">
<h1 class="logo">
<a href="/">
<img src="http://happyalliance.org/view/images/common/logo.png" alt="행복얼라이언스" />
</a>
</h1>
<ul id="gnb" class="gnb">
<li class="g1">
<a href="/happy/alliance.php">행복얼라이언스</a>
</li>
<li class="g2">
<a href="/happy/step.php">행복을 잇다</a>
<div class="depth2">
<ul>
<li class="g2_3">
<a href="/happy/step.php">행복을 잇는 징검다리</a>
</li>
<li class="g2_2">
<a href="/happy/happiness.php">행복지수 Test</a>
</li>
<li class="g2_1">
<a href="/happy/connect.php">행복을 잇는#</a>
</li>
</ul>
</div>
</li>
<li class="g3">
<a href="/happy/sketch.php">행복한 스토리</a>
</li>
<li class="g4">
<a href="/happy/surpport.php">행복얼라이언스 서포터즈</a>
</li>
<li class="g5">
<a href="/happy/party.php">행복얼라이언스 파티</a>
</li>
</ul>
<a href="https://www.facebook.com/happyalliance.org/" target="_blank" class="hd_facebook">
<img src="http://happyalliance.org/view/images/common/hd_facebook.gif" alt="행복얼라이언스 공식 페이스북" />
</a>
</div>
</div>
<div id="container">
<div class="step_wrap">
<iframe src="https://www.sklookie.com/" style="width: 980px; border: none;" frameBorder="0" scrolling="no"></iframe>
</div>
</div>
<div id="footer">
<dl class="site_share">
<dt>
<img src="http://happyalliance.org/view/images/common/site_share.gif" alt="SITE SHARE" />
</dt>
<dd>
<a href="https://www.facebook.com/sharer.php?u=http://happyalliance.org" target="_blank">
<img src="http://happyalliance.org/view/images/common/ft_sns_facebook.gif" alt="페이스북" />
</a>
</dd>
<dd>
<a href="https://story.kakao.com/share?url=http://happyalliance.org" target="_blank">
<img src="http://happyalliance.org/view/images/common/ft_sns_kakaostory.gif" alt="카카오스토리" />
</a>
</dd>
</dl>
<div class="inner">
<div class="ft_notice">
<p class="copyright">
<a href="http://skhappiness.org/index.jsp" target="_blank">
<img src="http://happyalliance.org/view/images/common/copyright.gif" alt="ⓒ 2017 행복나눔재단. ALL RIGHTS RESERVED">
</a>
</p>
<a href="javascript:Newriver.Util.AjaxPopup('open', '/popup/privacy.php');" class="policy" >
<img src="http://happyalliance.org/view/images/common/policy.gif " alt="개인정보취급방침 " />
</a>
</div>
<a href="#top " class="btn_top "><img src="http://happyalliance.org/view/images/common/top_btn.gif " alt="TOP "></a>
</div>
</div>
</div>
<!-- iframe 보다 아래 와야 한다. -->
<script type="text/javascript">
$('iframe').iFrameSizer({
autoResize: true,
bodyBackground: null,
bodyMargin: null,
bodyMarginV1: 0,
bodyPadding: null,
checkOrigin: true,
enablePublicMethods: false,
heightCalculationMethod: 'offset',
interval: 32,
log: false,
maxHeight: Infinity,
maxWidth: Infinity,
minHeight: 0,
minWidth: 0,
scrolling: false,
sizeHeight: true,
sizeWidth: false,
tolerance: 0,
closedCallback: function () { },
initCallback: function () { },
messageCallback: function () { },
resizedCallback: function () { },
callback: function (messageData) {
return true;
}
});
</script>
</body>
</html>
자식창
jQUery 와 함께 자식 창에는 iframeResizer.contentWindow.min.js 를 참조한다.
<head>
<title>행복얼라이언스</title>
<script type="text/javascript" src="http://happyalliance.org/view/common/js/jquery-1.11.1.min.js"></script>
</head>
body 태그 제일 아래 위치한다.
<!-- iframe에서는 가장 마지막 부분에 호출한다 -->
<script type="text/javascript" src="/Content/iframeResizer.contentWindow.min.js"></script>
'프로그래밍 > jQuery 👍' 카테고리의 다른 글
| javascript : keyup 에 delay 딜레이 설정하기 (0) | 2018.04.25 |
|---|---|
| javascript 로 파라미터 parameter parse 해서 piwik 의 eventname 추가하기 (0) | 2018.04.19 |
| Javascript 의 this 키워드 사용법과 setTimeout 알아보기 (0) | 2018.03.28 |
| image 이미지 경로 변경하는 jquery 및 html (0) | 2017.09.29 |
| jquery-number 은 숫자 형태를 다양한 문자 형태 제공 (0) | 2017.09.28 |