iframe 내용에 맞게 자동으로 크기 조절하기
iframe을 쓰면 페이지 로딩시간을 줄일 수 있어서 가끔쓰는데,
내용이 넘어버리게 되면 스크롤바가 나타나서 불편하더군요.
세이클럽도 iframe 을 열심히(?)하고 있는 곳인데, 자기네들한테 맞게 만들어진거라 좀 쓰기가 그렇더라구요.
그래서 간편하게 만들어봤습니다.
iframe에 들어가는 문서에 삽입해주셔야 합니다~ *^^*
<script>
// by 행복한고니(e-mail : gonom9 at empal.com, MSN : gonom9 at hotmail.com)
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>
위 함수를 삽입하고, 문서 제일 아래쪽에
<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(FRAMEID);" + oldFn); //새함수와 기존의 함수를 추가해서 onload이벤트에 할당
</script>
를 삽입해주세요. 가끔씩 body에 onLoad 이벤트를 쓰시는 분들이 있는데 그 분들을 위한 함수입니다.
사용하실땐
iframe에 id와 name 속성을 같은 이름으로 할당하셔야 합니다.
예)
<iframe id=innerFrame name=innerFrame></iframe>
<script>
...(생략)
window.onload = newFunction("resizeFrame('innerFrame');" + oldFn);
</script>
예제페이지 : http://ece.uos.ac.kr/~enc/gony/test.html
예제페이지 : http://ece.uos.ac.kr/~enc/gony/test2.html
제로보드 쓰시는 분들은
<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(FRAMEID);" + oldFn); //새함수와 기존의 함수를 추가해서 onload이벤트에 할당
</script>
이 부분을
<script>
var oldFn = new String(window.onload);
window.onload = new Function("resizeFrame(FRAMEID);" + oldFn); //새함수와 기존의 함수를 추가해서 onload이벤트에 할당
</script>
이렇게 바꿔주세요.
다시한번 말씀드리는데 iframe의 내용이 되는 문서에 삽입해주셔야 합니다.
그럼 이만~ *^^*
P.S// 괜찮으면 추천한방 때려주세요~ 룰루랄라~
알바를 알아봐야겠다... 슬슬 자금의 압박이... -_-;;
http://www.nzeo.com/bbs/zboard.php?id=p_javascript&page=1&sn1=&divpage=1&sn=off&ss=on&sc=off&select_arrange=vote&desc=desc&no=212<div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]</div>
내용이 넘어버리게 되면 스크롤바가 나타나서 불편하더군요.
세이클럽도 iframe 을 열심히(?)하고 있는 곳인데, 자기네들한테 맞게 만들어진거라 좀 쓰기가 그렇더라구요.
그래서 간편하게 만들어봤습니다.
iframe에 들어가는 문서에 삽입해주셔야 합니다~ *^^*
<script>
// by 행복한고니(e-mail : gonom9 at empal.com, MSN : gonom9 at hotmail.com)
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>
위 함수를 삽입하고, 문서 제일 아래쪽에
<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(FRAMEID);" + oldFn); //새함수와 기존의 함수를 추가해서 onload이벤트에 할당
</script>
를 삽입해주세요. 가끔씩 body에 onLoad 이벤트를 쓰시는 분들이 있는데 그 분들을 위한 함수입니다.
사용하실땐
iframe에 id와 name 속성을 같은 이름으로 할당하셔야 합니다.
예)
<iframe id=innerFrame name=innerFrame></iframe>
<script>
...(생략)
window.onload = newFunction("resizeFrame('innerFrame');" + oldFn);
</script>
예제페이지 : http://ece.uos.ac.kr/~enc/gony/test.html
예제페이지 : http://ece.uos.ac.kr/~enc/gony/test2.html
제로보드 쓰시는 분들은
<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(FRAMEID);" + oldFn); //새함수와 기존의 함수를 추가해서 onload이벤트에 할당
</script>
이 부분을
<script>
var oldFn = new String(window.onload);
window.onload = new Function("resizeFrame(FRAMEID);" + oldFn); //새함수와 기존의 함수를 추가해서 onload이벤트에 할당
</script>
이렇게 바꿔주세요.
다시한번 말씀드리는데 iframe의 내용이 되는 문서에 삽입해주셔야 합니다.
그럼 이만~ *^^*
P.S// 괜찮으면 추천한방 때려주세요~ 룰루랄라~
알바를 알아봐야겠다... 슬슬 자금의 압박이... -_-;;
http://www.nzeo.com/bbs/zboard.php?id=p_javascript&page=1&sn1=&divpage=1&sn=off&ss=on&sc=off&select_arrange=vote&desc=desc&no=212<div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]</div>
댓글 1개
드렁크수달스
19년 전
<SCRIPT LANGUAGE="JavaScript">
<!--
function resizeIframe(fr) {
fr.setExpression('height',aaa.document.body.scrollHeight);
fr.setExpression('width',aaa.document.body.scrollWidth);
}
//-->
</SCRIPT>
<iframe frameborder="0" id="aaa" scrolling="no" src="test.htm" onload="resizeIframe(this)"></iframe>
<!--
function resizeIframe(fr) {
fr.setExpression('height',aaa.document.body.scrollHeight);
fr.setExpression('width',aaa.document.body.scrollWidth);
}
//-->
</SCRIPT>
<iframe frameborder="0" id="aaa" scrolling="no" src="test.htm" onload="resizeIframe(this)"></iframe>
게시글 목록
| 번호 | 제목 |
|---|---|
| 12007 |
기타
그라디언트
5
|
| 12006 | |
| 12005 | |
| 12000 |
Flash
일러스트 단축키
4
|
| 11994 |
Flash
[[ 플래시 MX 단축키 요약 ]]
5
|
| 11993 | |
| 11992 | |
| 11991 |
JavaScript
adduser 명령어 기본사용법
|
| 11990 |
MySQL
리눅스 자동백업
|
| 11989 | |
| 29203 | |
| 11988 |
Linux
Xinetd 설치하기&설명
|
| 11986 |
MySQL
mysql버전확인
1
|
| 11985 |
JavaScript
su, telnet, ftp 권한제한
|
| 11984 | |
| 11983 |
JavaScript
Portsentry 1.1 설치하기(실시간해킹방지프로그램)
|
| 11982 |
Linux
리눅스에서 휴지통 (safedelete)
|
| 29202 |
HTML
apache2 가상호스트 설정방법
|
| 29201 | |
| 24968 | |
| 11981 |
JavaScript
시작과 멈춤이 가능한 스크롤 텍스트
|
| 29200 |
HTML
이미지에 마우스만 올려도 링크로 이동
|
| 29198 | |
| 11979 | |
| 11978 |
Flash
php.ini정보
|
| 11975 |
JavaScript
Lightbox2 적용 방법
2
|
| 11973 |
기타
rpm 명령어
1
|
| 11972 |
기타
Trac 설치
|
| 11971 | |
| 11970 |
기타
META 태그 사용법
|
| 11966 | |
| 11962 |
MySQL
MySQL 다운로드
3
|
| 29197 | |
| 29196 |
HTML
간단PHP(4)
|
| 11961 |
기타
간단PHP(3)
|
| 11960 |
기타
간단PHP(2)
|
| 11959 |
JavaScript
간단PHP(1)
|
| 11958 | |
| 11956 | |
| 11952 | |
| 11948 |
JavaScript
[질문] 페도라리눅스에서 한글깨짐현상
3
|
| 11944 | |
| 11936 | |
| 11935 | |
| 29195 | |
| 11934 |
JavaScript
포토샵 CS3에서 JPG 파일을 RAW 파일처럼 보정하기 - 사진 후보정
|
| 29191 | |
| 11933 |
JavaScript
[소스] 배경이미지 바꾸기 (PHP에서)에 대한 초보
|
| 29186 | |
| 11932 |
Flash
플래쉬쪽에서의 파일업로드
|
| 11931 |
Flash
플래쉬에서 PHP와 연동하면서 파일 업로드
|
| 11926 |
Flash
초보가 올리는 왼쪽 메뉴(허접)
4
|
| 11922 | |
| 29183 | |
| 11920 | |
| 11916 | |
| 11915 | |
| 11913 |
JavaScript
타일 이미지 멥핑
1
|
| 11910 | |
| 29182 |
HTML
브러쉬만들기
|
| 11904 | |
| 11901 |
기타
눈물만들기
2
|
| 11900 | |
| 29181 |
HTML
말랑말랑 젤리 텍스트
|
| 11898 | |
| 29179 |
HTML
간단하게 수채화 느낌 내기
1
|
| 11894 |
JavaScript
htmlspecialchars() 역변환(반대) 함수
3
|
| 11892 | |
| 11890 |
JavaScript
배경이미지 바꾸기 (PHP에서)
1
|
| 11889 |
JavaScript
검색창 추가
|
| 11888 | |
| 11886 |
기타
질문입니다
1
|
| 11883 | |
| 11879 | |
| 11875 | |
| 29178 |
HTML
팝업소스 관련질문-오늘하루창안열기
|
| 29167 |
HTML
자바스크립으로 플래쉬 메뉴처럼
10
|
| 11874 |
JavaScript
글씨의 색을 자동으로 변환시켜주는 함수
|
| 29166 | |
| 11872 | |
| 11870 |
JavaScript
[스크립트] 이미지 리사이징
1
|
| 11867 | |
| 11866 | |
| 11865 |
MySQL
MySQL에서 Query Cache 사용하기
|
| 29165 |
HTML
색상표
|
| 29162 |
HTML
입출력폼 생성기
2
|
| 11861 |
MySQL
무료 웹방화벽 Modsecurity..!
3
|
| 11851 |
MySQL
리눅스 포기 하고 싶습니다.. ㅠ.ㅠ
9
|
| 11850 | |
| 11847 | |
| 11846 | |
| 11845 |
JavaScript
ucc(동영상) 서비스 운영관련 자료 (키워드 ffmpeg)
|
| 11840 | |
| 11826 | |
| 11825 |
MySQL
MySQL 한글 정렬 Tip
|
| 11823 |
기타
외부문서불러오기
1
|
| 11816 | |
| 11808 |
Flash
플래시 메뉴 소스
7
|
| 11805 | |
| 11804 |
JavaScript
<script>
|
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기