如果考慮使用 iframe 的話...
試看看下面的方式...
主網頁.htm
語法:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>連結頁</title>
</head>
<body>
<div class="Main">
(最小高度)350<br> iframe的 id 必須是 "myIframe", 而name可依需要去設定, 也可以不設, 如果要用超連結的target, 就必須設定name<p>注意：在某些以css設定的版面中，整個div的高度會被視為0,
<br>
造成網頁高度無法正確偵測, 需在<body>前面再加上&nbsp;<br>
或者其他文字，以便正常運作</p>
<br>(註：子網頁最底下都要加1行程式碼, 以便在頁面變更時, 自動向主頁面要求檢查框架大小, 並自動調整)
<p><br>
<a target="myFrame123" href="子網頁1.htm">子網頁1</a> <a target="myFrame123" href="子網頁2.htm">子網頁2</a> <a target="myFrame123" href="子網頁3.htm">子網頁3</a><br>
<IFRAME id="myIframe" name="myFrame123" style="WIDTH: 770px; HEIGHT: 470px"
src="子網頁1.htm" frameBorder="1"
scrolling="no"></IFRAME>
</div>
</body>
<SCRIPT>
var tempMinIframeHight = 350; //設定最小Iframe高度...
var iFrameSelf = document.getElementById('myIframe');
var iFrameContentDocument;
function SCFS_iFrameResize()
{
if(document.all)
{ //IE
iFrameContentDocument = document.frames('myIframe').document;
}
else
{
iFrameContentDocument = document.getElementById('myIframe').contentDocument;
}
SCFS_Custom_iFrame_AutoResize(iFrameSelf, iFrameContentDocument, tempMinIframeHight);
return false;
}
function SCFS_Custom_iFrame_AutoResize(iFrame_Self, iFrame_ContentDocument, MinHeight)
{
//cwvdavid備註:遇到 go(-2)...直接往回跳2頁的時候
//或者iframe裡面的頁面 還沒載入完畢之前, 會找不到body...
//因此, 不必調整畫面寬度
if(iFrame_ContentDocument.body)
{
h = iFrame_ContentDocument.body.scrollHeight; //找出iframe裡面的畫面的大小, 然後將iframe本身設定為該畫面的大小(外加10~20)
if(h < MinHeight) h = MinHeight; //最小高度
iFrameSelf.style.height = (h + 30) + 'px';
}
}
</SCRIPT>
</html>
子網頁1.htm
語法:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>子網頁1</title>
</head>
<body>
<div class="Main">
1122334455<br>1122334455<br>1122334455<br>1122334455<br>
1122334455<br>1122334455<br>1122334455<br>1122334455<br>
1122334455<br>1122334455<br>1122334455<br>1122334455<br>
1122334455<br>1122334455<br>1122334455<br>1122334455<br>
1122334455<br>1122334455<br>1122334455<br>1122334455<br>
1122334455<br>1122334455<br>1122334455<br>1122334455<br>
</div>
</body>
</html>
<script> function SFCS_parentFrameResize() { if(window.parent) if(window.parent.SCFS_iFrameResize) window.parent.SCFS_iFrameResize(); } SFCS_parentFrameResize(); window.document.onclick = function() { window.setTimeout("SFCS_parentFrameResize()",100); } </script>
子網頁2.htm
語法:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>子網頁2</title>
</head>
<body>
<div class="Main">
AABBCCDD<br>AABBCCDD<br>AABBCCDD<br>
AABBCCDD<br>AABBCCDD<br>AABBCCDD<br>
AABBCCDD<br>AABBCCDD<br>AABBCCDD<br>
AABBCCDD<br>AABBCCDD<br>AABBCCDD<br>
AABBCCDD<br>AABBCCDD<br>AABBCCDD<br>
</div>
</body>
</html>
<script> function SFCS_parentFrameResize() { if(window.parent) if(window.parent.SCFS_iFrameResize) window.parent.SCFS_iFrameResize(); } SFCS_parentFrameResize(); window.document.onclick = function() { window.setTimeout("SFCS_parentFrameResize()",100); } </script>
子網頁3.htm
語法:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>子網頁3</title>
</head>
<body>
<div class="Main">
778899<br>778899<br>778899<br>778899<br>778899<br>
</div>
</body>
</html>
<script> function SFCS_parentFrameResize() { if(window.parent) if(window.parent.SCFS_iFrameResize) window.parent.SCFS_iFrameResize(); } SFCS_parentFrameResize(); window.document.onclick = function() { window.setTimeout("SFCS_parentFrameResize()",100); } </script>