內聯框架高度iframe自適應問題
阿新 • • 發佈：2019-02-05
這兩天這專案遇到一個難題。網頁左邊是選單欄，右邊是內聯框架。根據選單欄的點選改變右邊內聯框架的連結頁面，那麼問題來了，不同的頁面高度不一樣。
一直在網上找各種解決方法，但都不能完美解決我的問題。
糾結了2天。結果在某天洗澡的時候突然醒悟。為什麼我要執著於內聯框架的高度自適應？我可以反其道而行之。讓內聯框架的滾動條代替主頁面的滾動條。
一直以來大家的做法都是讓內聯框架的滾動條消失。防止出現既有 主頁面滾動條、又有內聯框架滾動條。但這樣就需要內聯框架高度自適應，才能使巢狀頁面完全顯示出來。然而內聯框架高度自適應就是一個大麻煩。
如果反著來做，只需要簡單程式碼。
首先讓主頁面的 滾動條消失
style="overflow-y: hidden"其次讓內聯框架的滾動條自動化 scrolling = "auto"內聯框架的高度 height = "100%<span style="font-family: Arial, Helvetica, sans-serif;">"</span><body style="overflow-y: hidden"> <nav>........</nav> <iframe name="iframe" height="100%" src="home.html" frameborder="0" scrolling="auto"> </iframe> </body>
這樣子就能簡單的實現所謂的內聯框架高度自適應了。