이전
목록
다음
h

iframe의 높이를 내용에 맞게 자동으로 맞춰주는 함수

티파니
프로필 보기이 회원 글보기이 회원의 댓글보기
 · 2009-01-17 (토) 00:42:48 · 4234 · 3
/*    iframe Resizing
    익스플로러 6, 넷스케이프 8 이상에서 작동
    너비는 적용안되고 높이만 자동 리사이즈
    Ex)
        <iframe src="주소" width="640" marginwidth="0" marginheight="0" frameborder="0" onLoad="ResizeIFrame(this);"></iframe>
*/




function resizeIFrame(iframeId)
{
    try {
        var innerBody = iframeId.contentWindow.document.body;
        var innerHeight = innerBody.scrollHeight + (innerBody.offsetHeight - innerBody.clientHeight);
   
        if(iframeId.style.height != innerHeight) {
            iframeId.style.height = innerHeight;
        }
        if(document.all) {
            innerBody.attachEvent('onclick',parent.do_resize);
            innerBody.attachEvent('onkeyup',parent.do_resize);
        }
        else {
            innerBody.addEventListener("click", parent.do_resize, false);
            innerBody.addEventListener("keyup", parent.do_resize, false);
        }
    }
    catch (e) {
    }
}
[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]
#퍼블리셔팁 #퍼블리셔 #팁자료실 #html
|

댓글 3개

허허당빵근
프로필 보기이 회원 글보기이 회원의 댓글보기
 2009-03-15 (일) 23:22:55
이렇게 하여도 됩니다.

<!-- 아이프레임 창 높이 조절 시작 -->
<script language="JavaScript">
<!--
function calcHeight() {
//find the height of the internal page
var the_height=
document.getElementById('iframe').contentWindow.
document.body.scrollHeight;
//change the height of the iframe
document.getElementById('iframe').height=
the_height;
}
//-->
</script>
<!-- 아이프레임 창 높이 조절 끝 -->

여기까지를 <head>와 </head>사이에 넣으시고


게시판을 삽입하는 곳에는

<!--- 게시판 삽입 시작 -->
<?
echo "<iframe id=iframe onLoad=\"calcHeight();\" src=\"여기에 게시판 주소를 넣으세요\" scrolling=no frameborder=0 width=1000 height=0></iframe>";
?>
<!--- 게시판 삽입 --->
농농사랑
프로필 보기이 회원 글보기이 회원의 댓글보기
 2009-03-27 (금) 11:47:33
지마켓 등에서 상품 등록시 아이프레임을 사용하려고 하는데, 높이 조절이 자동으로 안되네요..
지지킬
프로필 보기이 회원 글보기이 회원의 댓글보기
 2010-04-08 (목) 21:31:12
다른 서버의 웹문서에도 가능한가요???
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
태그 필터 (최대 3개) 전체 개발자 소스 기타 mysql 팁자료실 javascript php linux flash 정규표현식 jquery node.js mobile 웹서버 os 프로그램 강좌 썸네일 이미지관련 도로명주소 그누보드5 기획자 견적서 계약서 기획서 마케팅 제안서 seo 통계 서식 통계자료 퍼블리셔 html css 반응형 웹접근성 퍼블리싱 표준화 반응형웹 홈페이지기초 부트스트랩 angularjs 포럼 스크린리더 센스리더 개발자톡 개발자팁 퍼블리셔톡 퍼블리셔팁 기획자톡 기획자팁 프로그램강좌 퍼블리싱강좌
+
제목 글쓴이 날짜 조회
10-09-25 조회 2,717
10-09-19 조회 2,755
10-09-15 조회 2,754
10-09-15 조회 4,159
10-09-15 조회 3,374
10-09-15 조회 2,490
10-09-07 조회 3,599
10-08-27 조회 4,062
10-06-11 조회 4,225
10-05-31 조회 2,476
10-02-27 조회 4,999
10-02-09 조회 3,748
09-10-10 조회 7,342
09-03-19 조회 3,185
09-02-09 조회 3,462
09-02-09 조회 4,531
08-11-01 조회 2,906
08-09-29 조회 4,559
08-09-26 조회 3,511
08-09-26 조회 3,589
08-09-26 조회 2,724
08-09-26 조회 3,768
08-09-26 조회 3,492
08-09-26 조회 4,254
08-09-18 조회 3,571
08-09-09 조회 3,227
08-08-28 조회 2,771
08-07-06 조회 3,539
08-05-21 조회 4,702
08-05-13 조회 4,536
08-04-17 조회 4,917
08-02-19 조회 3,538
08-01-18 조회 3,841
08-01-10 조회 3,816
07-10-22 조회 3,653
07-10-09 조회 4,306
07-10-03 조회 3,511
07-07-06 조회 4,211
07-07-06 조회 4,425
07-07-06 조회 4,035
07-06-28 조회 3,565
07-06-05 조회 3,564
07-06-05 조회 4,112
07-05-30 조회 3,286
07-05-02 조회 3,685
07-04-15 조회 5,147
07-04-11 조회 3,628
07-04-05 조회 3,926
07-03-31 조회 3,149
07-03-31 조회 4,123
07-03-30 조회 3,731
07-03-24 조회 4,000
07-03-22 조회 3,658
07-03-12 조회 4,408
07-02-16 조회 3,269
07-02-14 조회 5,165
07-02-10 조회 3,994
07-02-09 조회 4,379
07-01-19 조회 4,047
07-01-16 조회 4,975
06-12-16 조회 5,835
06-11-30 조회 3,599
06-11-25 조회 3,705
06-10-15 조회 5,066
06-09-26 조회 5,308
06-09-26 조회 5,425
06-09-22 조회 4,269
06-09-21 조회 3,543
06-09-21 조회 3,632
06-09-02 조회 3,484
06-08-08 조회 5,115
06-07-20 조회 3,718
06-07-17 조회 3,348
06-07-13 조회 4,171
06-07-11 조회 3,471
06-07-11 조회 3,480
06-07-11 조회 3,836
06-06-29 조회 6,063
06-06-19 조회 6,455
06-06-02 조회 3,511
06-05-24 조회 4,996
06-05-14 조회 7,775
06-05-08 조회 3,887
06-02-02 조회 5,451
05-12-16 조회 4,505
05-12-05 조회 5,155
05-06-28 조회 4,108
05-04-11 조회 4,063
05-04-11 조회 4,251
05-04-11 조회 3,315
05-03-13 조회 3,218
05-03-12 조회 4,296
04-12-08 조회 7,779
04-12-01 조회 5,184
04-11-28 조회 3,358
04-11-28 조회 3,198
04-08-05 조회 5,613
04-08-05 조회 4,966
04-08-05 조회 5,573
글쓰기