2013-04-16 2 views
0

iframe 크기를 변경해야합니다. 이건 내 HTML 코드iframe이 자바 스크립트로 크기가 변경되는 경우

<iframe id="stream" width="720" height="433" src="#HiddedIt" style="border:0;outline:0" frameborder="0" scrolling="no"></iframe> 

입니다 그리고 이것은 내 자바 스크립트입니다 : 사용자의 해상도는 내가이 일을 해요 어디 말할 수 (1100)보다 낮은 경우

if (window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth < 1100){ 
    document.getElementById("stream").width = "485px"; 
    document.getElementById("stream").height = "295px"; 
} 

그것은 iframe 대응의 크기를 변경하지 않습니다 잘못? 고맙습니다.

if은 작동하지만 iframe의 크기는 변경되지 않습니다.

+1

자바 스크립트가 문서 흐름의 'iframe'앞에 있습니까? – ASGM

+0

질문을 완전히 이해하지 못했지만 Javascript가'' – Kyrbi

답변

1

자바에서 이 오기 전에 문제가 발생한다고 생각합니다. 브라우저는 시퀀스의 HTML을 구문 분석합니다.

실제 문서를 보지 않고 <head>에서 자바 스크립트를 호출하고 <body>에 을 생성하는 것으로 상상할 수 있습니다.

<head>의 자바 스크립트를 실행하면 아직 이 생성되지 않으므로 변경 대상이 없습니다.

을 만든 후에 <body>에서 자바 스크립트를 호출하는 것이 해결책입니다. 또는, iframe을 만든 후 스크립트를 실행 window.onload을 사용할 수 있습니다 : 자바 스크립트 프로그래밍 IFRAME의 크기를 조정하는

window.onload = function() { 
    if (
     window.innerWidth < 1100 || 
     document.documentElement.clientWidth < 1100 || 
     document.body.clientWidth < 1100 
    ){ 
     alert("Yes"); 
     document.getElementById("stream").width = "485px"; 
     document.getElementById("stream").height = "295px"; 
    } 
} 
0

당신은 jQuery 라이브러리를 사용할 수 있습니다.

아래 코드에서 "#iframe"값은 IFRAME의 ID입니다. 그런 다음 IFRAME의 CSS 높이를 설정하는 높이 값을 플러그인 할 수 있습니다.

$("#iframe").css("height", "50px"); 

CSS 값을 설정하는 데 .css를 사용할 수 있습니다.

관련 문제