隨筆-46  評論-54  文章-0  trackbacks-0
          Searching "iframe height 100" in 谷歌!
          1、
          <iframe?height="100%">?
          no work

          2、
          <iframe?stlye="height:?100%;">?
          no work

          3、CSS
          1?/***?html?file?***/
          2?
          3?<p?class="forum2">
          4??<iframe?src="http://mydomain.com/phpbb"?title="Forum"?scrolling="auto">
          5??</iframe>
          6?</p>

          ?1?/***?css?file?***/
          ?2?
          ?3?..forum2?{
          ?4?????height:?900px;
          ?5?????width:?100%;
          ?6?}
          ?7?
          ?8?IFRAME?{
          ?9?????min-height:?900px;
          10?????height:?100%;
          11?????width:?100%;
          12?}


          4、JavaScript
          ?1?<script?language="JavaScript">
          ?2?<!--
          ?3?function?resize_iframe()
          ?4?{
          ?5???//resize?the?iframe?according?to?the?size?of?the
          ?6?
          ?7???//window?(all?these?should?be?on?the?same?line)
          ?8?
          ?9???document.getElementById("glu").height=
          10?????document.body.offsetHeight-
          11?????document.getElementById("glu").offsetTop-26;
          12?}
          13?
          14?//?this?will?resize?the?iframe?every
          15?//?time?you?change?the?size?of?the?window.
          16?window.onresize=resize_iframe;?
          17?
          18?//Instead?of?using?this?you?can?use:?
          19?//????<BODY?onresize="resize_iframe()">
          20?
          21?
          22?//-->
          23?</script>

          1?<iframe?id='glu'?width=100%?onload='resize_iframe()'>
          2?</iframe>


          5、用CSS構建iframe效果的四種方法

          6、W3C關于iframe的描述
          posted on 2006-04-18 19:28 rox 閱讀(4962) 評論(5)  編輯  收藏 所屬分類: AJAX

          評論:
          # re: How to set iframe height 100% or scrollable at out page? 2006-04-20 22:26 | rox
          一個很牛的JavaScript網站!
          http://www.activewidgets.com/


          Google 中搜索 "iframe auto height"

          1、Auto Fit IFrame to Content
          http://www.devpapers.com/article/200

          2、iFrame Auto Resize
          About a month ago I was faced with the same need (to conditionally resize an iframe) and discovered that it just wouldn't work reliably due to browser quirks.
          However, I solved the problem by creating a div in the parent page that got replaced with the innerHTML from the body of the document in the iframe. Worked like a charm.
          You can use an onload event in the iframe element in the parent page or an onload event in the body of the document in the iframed page to trigger the exchange.

          Post a stripped down version of the page if you can. One that shows exactly how the iframe fits into the structure of the page.

          The solution I settled on works like this:
          The parent page has a javascript function like this:

          function insertIt() {
          var _y = document.getElementById('framediv');
          var _x = window.frames[0].document.body.innerHTML;
          _y.innerHTML = _x
          }
          Then, the parent page has a div with the id "framediv" which is placed where the contents of the iframe should appear on the page.
          The iframe element is then placed inside the div, like this:

          <div id="framediv">
          <iframe onload="insertIt();" src="/somewhere/content.htm" frameborder="no" width="555px" scrolling="no">
          </div>

          As you can see, there's onload="insertIt()" inside the iframe element. So when the iframe loads, the parent page immediately takes the contents of the body of the document contained in the iframe and actually replaces the iframe element with that content.

          It's a little tricky to comprehend, but it works great.

          You said you're a newbie, does this make any sense to you?

          also, is the iframe document located on the same server and the same domain as the parent page?
          That will play a part.   回復  更多評論
            
          # re: How to set iframe height 100% or scrollable at out page? 2006-06-29 14:56 | rox
          Dynamic iframe height

          Iframe SSI script II
          http://www.dynamicdrive.com/dynamicindex17/iframessi2.htm  回復  更多評論
            
          # re: How to set iframe height 100% or scrollable at out page? 2006-07-14 17:19 | rox
          <?xml version="1.0" encoding="gb2312"?>
          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
          <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">
          <head>
          <meta http-equiv="Content-Type" content="text/html;charset=gb2312" />
          <meta http-equiv="Content-Language" content="zh-CN" />
          <title>垂直居中</title>
          <style type="text/css">
          body, html { height:100%; }
          #outer { height:100%; overflow:visible; position:relative; }
          #outer[id] { display:table; position:static; }
          #middle { position:absolute; top:50%; }
          #middle[id] { display:table-cell; vertical-align:middle; position:static; }
          #inner { position:relative; top:-50%; }
          #inner[id] { position:static; }
          </style>
          </head>
          <body>
          <div id="outer">
          <div id="middle">
          <div id="inner">
          <p>111111這個在IE中可以實現居中,在Firefox中也可以實現居中1111111</p>
          </div>
          </div>
          </div>
          </body>
          </html>  回復  更多評論
            
          # re: How to set iframe height 100% or scrollable at out page? 2010-03-29 13:40 | rox
          # re: How to set iframe height 100% or scrollable at out page? 2014-03-14 11:01 | rox
          IE and chrome
          var iframe= $("#targetFrame");
          onloadEvent = 'this.style.height=Math.max(this.contentWindow.document.body.scrollHeight,this.contentWindow.document.documentElement.scrollHeight,200)+"px";'
          +'this.style.width="100%";';
          iframe.parent().css("height", "100%"); //div , p
          iframe.parent().css("width", "100%");
          iframe.attr("src", url);
          iframe.attr("onload", onloadEvent);   回復  更多評論
            
          主站蜘蛛池模板: 监利县| 清涧县| 阿巴嘎旗| 大竹县| 台北市| 鱼台县| 阿合奇县| 泾川县| 梧州市| 兴海县| 张家港市| 苍山县| 新乡市| 房产| 方正县| 东乌珠穆沁旗| 沁源县| 长春市| 葫芦岛市| 甘德县| 梧州市| 黎城县| 会泽县| 新宁县| 洮南市| 稻城县| 固阳县| 广东省| 蒲城县| 利辛县| 营山县| 大城县| 德庆县| 贵南县| 望都县| 响水县| 博爱县| 勐海县| 潮州市| 布拖县| 眉山市|