iframe 自适应高度[ff,ie下大同小异]

 法一:

<!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> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>iframe 自适应高度[ff,ie下大同小异]</title> <script language="javascript" type="text/javascript"> function dyniframesize(down) { var pTar = null; if (document.getElementById) { pTar = document.getElementById(down); } else { eval('pTar = ' + down + ';'); } if (pTar && !window.opera) { //begin resizing iframe pTar.style.display = "block" if (pTar.contentDocument && pTar.contentDocument.body.offsetHeight) { //ns6 syntax pTar.height = pTar.contentDocument.body.offsetHeight + 20; pTar.width = pTar.contentDocument.body.scrollWidth + 20; } else if (pTar.Document && pTar.Document.body.scrollHeight) { //ie5+ syntax pTar.height = pTar.Document.body.scrollHeight; pTar.width = pTar.Document.body.scrollWidth; } } } </script> </head> <body> <!-- 头部iframe --> <div style="width: 100%; border: 0px solid #3C72B0; background-image: url(../images/head_bg.png); background-repeat: repeat-x;"> <iframe src="top.html" width="100%"></iframe> </div> <!-- 中间左右侧iframe --> <div style="border: #000000 0px solid; float: left; width: 100%;"> <div style="float: left; width: 20%;"> <iframe src="left.html" scrolling="no" height="100%" id="ifm0" name="ifm0" onload="javascript:dyniframesize('ifm0');" width="100%"></iframe> </div> <div style="float: left; width: 80%;"> <iframe src="right.html" scrolling="no" id="ifm" name="ifm" onload="javascript:dyniframesize('ifm');" width="100%"></iframe> </div> </div> <!-- 尾部iframe --> <div style="height: 120px; width: 100%; background-color: #FF0000; float: left"> <iframe src="bottom.html" width="100%"></iframe> </div> </body> </html>

 

你可能感兴趣的:(iframe)