<iframe>高度自適應程式碼例項
本章節通過程式碼例項介紹一下如何實現iframe高度自適應效果,因為在實際應用中,我們往往需要<iframe>的高度能夠隨著引入頁面內容的高度變化而變化,這樣可以讓頁面能夠有融為一體的感覺。
程式碼如下:
[HTML] 純文字檢視 複製程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <script type="text/javascript"> window.onload=function(){ var ifm= document.getElementById("iframepage"); var subWeb = document.frames ? document.frames["iframepage"].document:ifm.contentDocument; if(ifm != null && subWeb != null){ ifm.height = subWeb.body.scrollHeight; } } </script> </head> <body> <iframe src="iframe.html" id="iframepage" name="iframepage" width="100%"></iframe> </body> </html>
以上程式碼可以實現高度自適應效果,但是不能夠實現跨域高度自適應,如要實現跨域高度自適應,具體可以參閱iframe實現跨域高度自適應程式碼例項一章節。
相關文章
- iframe高度自適應程式碼例項
- jquery實現的iframe高度自適應程式碼例項jQuery
- ajax應用實現iframe高度自適應程式碼例項
- 原生javascript實現的iframe高度自適應程式碼例項JavaScript
- 文字框高度自適應例項程式碼
- textarea文字框高度自適應程式碼例項
- javascript實現的iframe高度自適應程式碼JavaScript
- html iframe高度自適應HTML
- iframe 跨域高度自適應跨域
- iframe自適應高度的外掛
- iframe高度自適應解決方案
- jquery 實現iframe 自適應高度jQuery
- 自動載入的iframe高度自適應
- css實現的規定最小高度然後高度自適應程式碼例項CSS
- 真正解決iframe高度自適應問題
- jquery實現的iframe高度自適應效果jQuery
- iframe之間通訊問題及iframe自適應高度問題
- js獲取iframe和父級之間元素,方法、屬,獲取iframe的高度自適應iframe高度JS
- 圖片尺寸大小自適應程式碼例項
- 移動端字型大小自適應程式碼例項
- 小程式Swiper高度自適應
- Iframe嵌入跨域頁面高度自適應實現詳解跨域
- 最新Iframe全瀏覽器相容自適應高度解決方案瀏覽器
- 移動端頁面大小自適應程式碼例項
- 微信小程式Swiper高度自適應微信小程式
- input文字框實現寬度自適應程式碼例項
- 圖片大小自適應手機螢幕程式碼例項
- jQuery實現的圖片尺寸自適應程式碼例項jQuery
- TabelViewCell高度自適應View
- 中間寬度自適應的三列布局程式碼例項
- 左欄尺寸固定右欄寬度自適應程式碼例項
- css水平元素寬度自適應均勻排列程式碼例項CSS
- jquery獲取元素高度程式碼例項jQuery
- 根據螢幕高度自適應元素高度
- textarea高度自適應詳解
- jQuery textarea框高度自適應jQuery
- UITableViewCell自適應圖片高度UIView
- 微信小程式swiper高度自適應,swiper的子元素高度不固定微信小程式