웹마스터 팁

  2. Support
  3. 웹마스터 팁

문서에 따른 아이프레임 heigh(높이) 값 자동 조절 (수정본)

2004.07.31 21:38

스토비━ⓒ

예전에 행복한 고니 님이
올려 주신 팁에 문제가 있어 이렇게..수정하여 다시 올립니다.
일단.,.,이렇게 유익한 소스를 올려 주신 고니님께 감사 드립니다.

먼저..소스의 사용 방법에 대해 알려 드리겠습니다.
소스는 아이프레임이 삽입되어 있는 문서에 넣는것이 아니라는걸
알려 드리고 싶습니다..
소스는 아이프레임의 대상이 되는..즉, 아이프레임에 보여지는 문서에
삽입 해야 하는 겁니다.
일단은..
아이프레임의 대상이 되는 문서
<head> 와 </head> 사이에

    <script>

    function resizeFrame(name){
        var oBody = document.body;
        var oFrame = parent.document.all(name);
        var min_height = 320; //iframe의 최소높이(너무 작아지는 걸 막기위함, 픽셀단위, 편집가능)
        var min_width = 465; //iframe의 최소너비
        var i_height = oBody.scrollHeight + (oBody.offsetHeight-oBody.clientHeight);
        var i_width = oBody.scrollWidth + (oBody.offsetWidth-oBody.clientWidth);

        if(i_height < min_height) i_height = min_height;
        if(i_width < min_width) i_width = min_width;
        oFrame.style.height = i_height;
        oFrame.style.width = i_width;

        parent.scrollTo(1,1); //부모문서의 스크롤 위치를 1, 1로 옮긴다.(오감도님이 지적해주셨어요~^^)
    }
    </script>

이 소스를 삽입 합니다..참고로 이 소스에서는 다른 수정이나, 설정 작업은
필요 없습니다.
그냥 이 원본 그대로 삽입 해 주세요..
그런 다음에..
<body> 와 </body> 사이 가장 마지막 줄에

<script>
var oldFn = "";
if(window.onload != null){
oldFn = new String(window.onload); //window.onload의 함수를 문자열로 받는다
oldFn = oldFn.substring(22,oldFn.length-2);
}
window.onload = new Function("resizeFrame('333innerFrame333');" + oldFn); //새함수와 기존의 함수를 추가해서 onload이벤트에 할당
</script>

이 소스를 삽입 해 줍니다.
여기서! '333innerFrame333' 이 부분을 넣고 싶은 이름으로 넣습니다.
그럼 아이프레임 대상 문서에는 모두 소스 작업이 끝난 것입니다.
음..
그런데..한가지 중요한 사실..
아이프레임에 보여질 페이지는 모두 상단의 소스가 삽입되어 있어야 합니다.
모두모두~



그런 다음에..
아이프레임을 넣을 곳에 하단의 소스를 삽입 합니다.

    <iframe src="보여질주소" id="333innerFrame333" name="333innerFrame333"></iframe>

이렇게,,삽입 합니다.
여기서 눈치 채신 분이 있을걸로 아는데요^^;
잘 보면 "333innerFrame333" 가 있죠?^^
"333innerFrame333" <- 이것은 아까 두번째 소스중
window.onload = new Function("resizeFrame('333innerFrame333');" + oldFn);
이 부분의 '333innerFrame333' 와 같은 이름이 써져 있어야 하는 것!!

잘 아시겠죠?

그럼 끝!!
한번 확인 해 보세요~^^;










행복한고니 님의 소스에서 수정 된 소스는
window.onload = new Function("resizeFrame('333innerFrame333'+ ');" + oldFn);
바로 이 부분 입니다.
리사이즈 프레임의 아이디 설정 부분에 '' 가 빠져 있었군요..
행복한고니 님의 게시물 코멘트로 수정본 올려 드리려 했는데..
워낙 오래 된 게시물이라T^T
아무튼..게시물만 낭비한 것 죄송 합니다.

그럼 항상 행복한 하루 되시구요~
더운 여름~ 피서 잘 다녀 오세요..
ㅃㄴㅃㄴ
이 게시물을
수정 삭제
좋아요
목록
제목 글쓴이 날짜
셀렉트 메뉴를 통해 갤러리 만들기 한현종 2004.09.10
랜디님의 iframe 크기조절 소스응용-iframe 최저길이 지정하기 [1] 김수형 2004.09.10
싸이처럼 테이블 안에서 버튼으로 이동/스크롤 하기 [5] 제로스 2004.09.09
이미지 사이즈에 맞게 새창띄우기 [오류보완] 정확하게 안열리는 오류 [11] beMax 2004.08.18
레이어를 클릭해서 보이거나 사라지게 하기 [3] †천상의燦† 2004.08.18
Javascipt로 구현한 MD5,MD4,SHA1 [10] 장종석 2004.08.06
원하는 아이프레임부분을 리로드하자! [1] †천상의燦† 2004.08.02
문서에 따른 아이프레임 heigh(높이) 값 자동 조절 (수정본) [3] 스토비━ⓒ 2004.07.31
아이프레임으로 문서크기 자동조절하기(완벽판) [13] 렌디 2004.07.21
웹 문서 암호화 스크립트 [1] 미친개 2004.07.20
레이어 5 - 뽀나수 둘 [6] 미친개 2004.07.07
레이어 4 - 뽀나수 하나 [1] 미친개 2004.07.07
레이어 3 - 메뉴판때기. [1] 미친개 2004.07.04
레이어 2 - 뷁뷁뷁뷁뷁봵 [7] 미친개 2004.07.04
둥근테이블을 홈피에 짜고싶을때../ [12] file zEn 2004.06.28
[추천] 세로형 배너 슬라이드 [4] ⓣinⓣin™ 2004.06.24
볼륨값이 얼마나 될까? [5] PHASE 2004.06.16
[추천] 가로형 배너 슬라이드 [7] file ⓣinⓣin™ 2004.06.10
[StylishJAVA]레이어를 이용한 슬라이드 메뉴 [5] ∑Ztxy 2004.06.05
지바 애플 아날로그 시계 소스입니다... [4] 한성민 2004.06.02
태그 쓰기