文章發佈於Sevendesign,如需轉貼請保留本訊息,並註明原文連結
原文連結:http://sevendesign1230.pixnet.net/blog/post/4059401

這次要來介紹iframe的應用,讓父頁面的iframe隨著子頁面的高度展開,簡單來說就是把iframe當成include的方式來操作,呈現的效果是一樣的,但是由於iframe可以在同個框架內載入不同分頁,在商業性的網頁設計,產品常需要被全部展開,但是iframe的基本設定,是需要給他一個完整的高度數值,所以這篇文章是說明如何將讀入的文件完整的在iframe展開。

 

<iframe>與</iframe>之間

<iframe name="ifrm01" id="ifrm01" src="01.htm" frameborder="0" width="695" height="100%" onload="document.getElementById('ifrm01').style.height=ifrm01.document.body.scrollHeight+ 00+'px'"></iframe>

註一:name及id及紅色字串中'xxxx'三者須為相同名稱,可自訂名稱。
註二:需設定高度為100% height="100%"。
註三:最後加上紅色字串.即可變成動態iframe。
※IE瀏覽器需掛在iis下才能正確瀏覽.在本機則不行 ,而Firefox則是沒有問題 。

Seven 發表在 痞客邦 PIXNET 留言(1) 人氣()


留言列表 (1)

發表留言
  • Ausir
  • 雖然說這樣子可以完全讓資料內容打開
    但是這個方法只有一次機會

    如果內部的資料是 AJAX 的話
    還是有可能把內容遮住的~

    使用的時候要注意~
  • 喔喔~非常感謝您的指教喔^^
    因為我不會弄到ajax的東西.所以感謝您提供的資訊^^

    Seven 於 2010/01/14 22:46 回覆

【 X 關閉 】

【PIXNET 痞客邦】國外旅遊調查
您是我們挑選到的讀者!

填完問卷將有機會獲得心動好禮哦(注意:關閉此視窗將不再出現)

立即填寫取消