>  기사  >  웹 프론트엔드  >  javascript 로딩 iframe 하위 페이지, 적응형 height_javascript 기술

javascript 로딩 iframe 하위 페이지, 적응형 height_javascript 기술

WBOY
WBOY원래의
2016-05-16 18:55:10921검색

메인 페이지에

코드 복사 안에 iframe이 있는 div가 있다고 가정합니다. 코드는 다음과 같습니다.

< ;div id="frameBox">



3개 메뉴 링크, 1.html, 2.html, 3.html 로드 iframe 페이지에서 각각.

window.onload가 각 페이지에 각각 로드된 후 세 개의 하위 페이지가 실행됩니다.
코드 복사 코드는 다음과 같습니다.

function aa(){
var newHeight = document.body.scrollHeight 20 "px";
window.parent.document.getElementById("frameBox ").style.height = newHeight;
//위 Firefox는 통과하지만 ie6에 다음 문장을 추가해야 합니다. 그렇지 않으면 iframe 높이가 변경되지만 보이는 영역은 변경되지 않습니다
window.parent .document.getElementById("frameWin").style.height = newHeight;
}

다음 메소드는 메인 페이지에만 코드를 삽입하면 됩니다:
페이지 코드:
코드 복사 코드는 다음과 같습니다.





js 스크립트(메인 페이지에 추가됨):
코드 복사 코드는 다음과 같습니다.

function test2(){
varframeWin = document .getElementById("frameWin");
varframeBox = document.getElementById("frameBox");
var newHeight;
if (frameWin.Document){
newHeight = frameWin.Document.body. scrollHeight 20 "px";
}else{
newHeight = frameWin.contentDocument.body.scrollHeight 20 "px";
}
frameWin.style.height =
frameBox.style; .height = newHeight
}
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사:JavaScript는 해당 year_time 및 날짜에서 월의 일자를 계산합니다.다음 기사:JavaScript는 해당 year_time 및 날짜에서 월의 일자를 계산합니다.

관련 기사

더보기