如何調整窗口上的iframe調整

我試圖調整窗口上的iframe元素調整如下：如何調整窗口上的iframe調整

唯一不同的是，在我原來的代碼我有PDF文檔src，卻沒有蘋果網站。

src='link-to-local-pdf'

我想它的窗口大小調整，使其分別調整iframe的本身，而不是在窗口上，但只在iframe中添加滾動。你能幫我嗎？

來源

2013-12-13 mathinvalidnik

所以，你要的iframe佔用儘可能多的空間沒有廣告可能ding滾動條？ – JensB

-1

這是做什麼，你想要什麼。

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

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

訣竅是絕對定位，這是幾乎相對其父。這個CSS給了the_iframe實際上一個50px的邊際，但在整個身體窗口。

來源

2013-12-13 14:41:03 peterh

你真的嘗試過嗎？因爲我剛剛嘗試過，但它與以前沒有什麼不同。它不斷向窗口添加滾動條。 – mathinvalidnik

對不起 - 我很高興地告訴你，怎麼做，我很高興向你解釋，它是如何工作的，但我不會調試你的腳本，如果你甚至沒有嘗試去理解，我解釋你的。 – peterh

好吧，我不想讓你調試我的腳本。我已經添加了jsfiddle的鏈接，我已經給出了一個非常基本的例子，並解釋了我的目標。我只需要使iframe可以自動識別。我不需要窗口卷軸。 – mathinvalidnik

希望我能正確理解你的意思。下面是一個頁面的例子，其中iframe自身始終適合其父窗口。

工作例如：http://jsfiddle.net/My6mj/

的javascript：

// 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; 
}

來源

2013-12-13 15:15:23 JensB

如何調整窗口上的iframe調整

回答

相關問題