2013-12-13 2 views
2

내가 창에서 iframe 요소의 크기를 조정하려고이 같은 크기를 조정 크기를 조정 크기를 조정하는 방법 :창은 iframe이

Link to jsfiddle

유일한 차이점은 내 원래의 코드에서 내가 SRC하지만 같은 PDF 문서를 가지고있다 사과 웹 사이트.

iframe 자체의 크기를 조정하고 창에 스크롤을 추가하지 않고 iframe에만 추가하도록 창 크기 조정에서 원합니다. 도울 수 있니?

+0

그래서 당신은 iframe을 같이 많은 공간을 차지하려는 광고없이 가능하다. 딩 스크롤바? – JensB

답변

-1

원하는대로하고 있습니다.

<body> 
    <iframe id="the_iframe"></iframe> 
</body> 

#the_iframe { 
    position: absolute; 
    left: 50px; 
    right: 50px; 
    top: 50px; 
    bottom: 50px; 
} 

트릭 부모에 대하여 실질적 있는 절대 위치이다. 이 CSS는 the_iframe에 사실상 50 픽셀의 여백을 제공하지만 전신 윈도우에서는 제공하지 않습니다.

+0

실제로 사용해 보셨습니까? 방금 시도했기 때문에 이전과 다른 점이 없습니다. 창에 스크롤을 계속 추가합니다. – mathinvalidnik

+0

미안하다. 나는 너에게 말할 수있게되어 기쁘다. 어떻게 할 수 있느냐, 어떻게 설명 할 수 있느냐에 대해 기쁘게 생각한다. 어떻게 작동하는지는 알지만, 스크립트를 디버깅하지 않을 것이다. 내가 너를 설명 했어. – peterh

+1

글쎄, 내 스크립트를 디버그하고 싶지 않아. jsfiddle에 대한 링크를 추가했습니다. 여기서는 꽤 기초적인 예제와 내가 지향하는 것을 설명합니다. 어떻게 든 iframe 자동 렌더링이 가능하도록 만들면됩니다. 창 스크롤은 필요 없어. – mathinvalidnik

2

호핑 나는 네가 옳은 것을 이해했다. 다음은 iframe이 항상 부모 창 내부에 맞춰지는 페이지의 예입니다.

근무 예 : http://jsfiddle.net/My6mj/

자바 스크립트 :

// set initial size 
$(document).ready(SetIframeSize); 

// resize on window resize 
$(window).on('resize', SetIframeSize); 

function SetIframeSize(){ 
    $("#external").width($(window).width() - 18); // added margin for scrollbars 
    $("#external").height($(window).height() - 35); 
} 

HTML :

<div> 
    <br/> 
    <div id="iframe-wrapper" align="center" style="z-index: 0"> 
     <iframe id="external" src="http://www.apple.com/">dada</iframe> 
    </div> 
</div> 

CSS :

body { 
    overflow:hidden; 
}