網頁內嵌入 (iframe) 網頁，自動依內容調整 iframe 框架的高度
網頁自動依內容調整嵌入 (iframe) 框架高度在網頁內嵌入 (iframe) 某物件，若超出設定的高處就會出現捲軸視窗。若嵌入的物件大小不一，要每次嵌入物件時，不要有捲軸視窗，讓顯示的框架高度自動等於物件內容高度，找來幾個較易的方法如下：
方法一：script 語法
程式碼：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>喵喵笨兔 -自動依內容調整 iframe 框架的高度</title>
<script>
function SetHeight(){
var f=document.getElementById('iframeID');
f.style.height = f.contentWindow.document.body.scrollHeight + 40 + 'px';
}
</script>
</head>
<body>
沒有自動依內容調整 iframe 框架的高度
<iframe frameborder="0" id="testID" src="gametxt/01_bloxorz.html" width="100%"></iframe>
自動依內容調整 iframe 框架的高度
<iframe frameborder="0" id="iframeID" onload="SetHeight();" src="gametxt/01_bloxorz.html" width="100%"></iframe>
</body>
</html>
範例結果：
沒有自動依內容調整 iframe 框架的高度自動依內容調整 iframe 框架的高度
方法二：jQuery 語法
要用 jQuery 語法，那當然要引入 jQuery.js 才可以唄！(須 jQuery 3.0以下)
程式碼：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>喵喵笨兔 の 喵喵的家~遊戲天地 - 網頁內嵌入 (iframe) 網頁，自動依內容調整 iframe 框架的高度</title>
<script src="js/jquery.min.js"></script>
<script>
$(function(){
$("#iframeid1").load(function(){
$(this).height($(this).contents().find("body").height() + 40);
});
});
</script>
</head>
<body>
沒有自動依內容調整 iframe 框架的高度
<iframe frameborder="0" id="testID1" src="gametxt/01_bloxorz.html" width="600"></iframe>
自動依內容調整 iframe 框架的高度
<iframe frameborder="0" id="iframeid1" src="gametxt/01_bloxorz.html" width="600"></iframe>
</body>
</html>
範例結果：
沒有自動依內容調整 iframe 框架的高度