網頁

2009年3月2日 星期一

完整的iframe auto height程式(在iframe內容頁中處理)

全部參考:
1.Iframe自動調整高度, 在子網域SubDomain的情形
2.處理iframe auto height(Iframe自適應高度)
3.處理iframe auto height(Iframe自適應高度) - 相關問題紀錄
4.完整的iframe auto height程式(在iframe內容頁中處理)
5.或許你想要 "html include html,兩種工具介紹。"


以下是一個完整的iframe auto height程式,放在iframe內容頁的網頁中即可。 看Demo
程式使用了google的AJAX Libraries API來載入jQuery,並使用jQuery來處理部份的程式。
不需要在iframe設定name或id,因為程式會找到自己的iframe。


11 則留言:

匿名 提到...

找了超多東西只有您的完全沒問題!!!
真的非常感謝!!!!

Wangaguo is Wangaguo 提到...

不客氣喲~

匿名 提到...

這寫法直接貼上就能使用真的很簡單
可以請問一下如果說
不使用 //利用google來載入jQuery
而是直接參考我網站的js要如何寫

Wangaguo is Wangaguo 提到...

已將程式改為較一般的寫法.
您只要將jquery.min.js那行的網址改為local的網址即可.
直接利用google cdn提供的jquery也是常見的使用方式.

匿名 提到...

我也找了很久和很多網站,只有你的程式真的沒有問題.非常感謝你...

匿名 提到...
網誌管理員已經移除這則留言。
匿名 提到...

您好,
找了很多方法
您提供的確實可用
非常感謝(:

不過Chrome瀏覽器底下
無法成功顯示?
請問有相關解決方法嗎?
感謝您

Wangaguo is Wangaguo 提到...

"不過Chrome瀏覽器底下,無法成功顯示?"
這段程式,一直有在運用,還沒注意到在chrome會不行?
接下來我會再測試看看。
也麻煩你再debug找找是否任何問題所造成的呢?

Wangaguo is Wangaguo 提到...

參考:http://newname.openfoundry.org/Example/IframeAutoHeight/main.html
其中內容會顯示parent iframe的數量,目前為1。
那麼同樣的程式複制到本機執行時,
在IE: parent iframe=1
在chrome: parent iframe=0
所在本機的chrome測試時,這是因為其內部安全性的機制,所以無法取得iframe。

所以結論是chrome請在web server的環境測試。

Unknown 提到...

Aguo大大您好,我想請問這個寫法適用於HTML裡面只有一個iframe回朔到父階層,把父層HTML高撐開的方法。我想請問的是,如果HTML裡面有兩個iframe 要再第三層(孫子層) 呼叫祖iframe 要如何改呢.. QQ? 謝謝大大 (範例是index上下兩個iframe,下面的iframe再塞入一個有左次級選單的HTML,右半部做的iframe...使用這個方法無法讓最外層的index知道底層iframe的高度...)
非常~感謝您的回覆!!!!

Wangaguo is Wangaguo 提到...

加上了這一行, 解決了多層級的iframe問題, 當下層iframe自身完成高度調整後, 再通知上層去調整高度, 直到每一層都完成高度調整.
if(parent != window) parent.iframe_auto_height();