教你用jquery實現(xiàn)iframe自適應(yīng)高度
更新時間:2014年06月11日 11:11:25 作者:
iframe因為能和網(wǎng)頁無縫的結(jié)合從而不刷新頁面的情況下更新頁面的部分數(shù)據(jù)成為可能,可是 iframe的大小卻不像層那樣可以“伸縮自如”,所以帶來了使用上的麻煩,給iframe設(shè)置高度的時候多了也不好,少了更是不行,今天我們就來分享2種使用jquery實現(xiàn)iframe自適應(yīng)高度的代碼
iframe代碼,注意要寫ID
復(fù)制代碼 代碼如下:
<iframe src="test.html" id="main" width="700" height="300" frameborder="0" scrolling="auto"></iframe>
jquery代碼一:
復(fù)制代碼 代碼如下:
//注意:下面的代碼是放在test.html調(diào)用
$(window.parent.document).find("#main").load(function(){
var main = $(window.parent.document).find("#main");
var thisheight = $(document).height()+30;
main.height(thisheight);
});
jquery代碼二:
復(fù)制代碼 代碼如下:
//注意:下面的代碼是放在和iframe同一個頁面調(diào)用
$("#main").load(function(){
var mainheight = $(this).contents().find("body").height()+30;
$(this).height(mainheight);
});
您可能感興趣的文章:
- jQuery簡單實現(xiàn)iframe的高度根據(jù)頁面內(nèi)容自適應(yīng)的方法
- js實現(xiàn)iframe自動自適應(yīng)高度的方法
- 使用jQuery不判斷瀏覽器高度解決iframe自適應(yīng)高度問題
- jsp頁面iframe高度自適應(yīng)的js代碼
- javascript原生和jquery庫實現(xiàn)iframe自適應(yīng)高度和寬度
- js控制iframe的高度/寬度讓其自適應(yīng)內(nèi)容
- iframe窗口高度自適應(yīng)的實現(xiàn)方法
- 如何設(shè)置iframe高度自適應(yīng)在跨域情況下的可用方法
- JavaScript 處理Iframe自適應(yīng)高度(同或不同域名下)
- 自動適應(yīng)iframe右邊的高度
相關(guān)文章
jQuery dataTables與jQuery UI 對話框dialog的使用教程
這篇文章主要介紹了jQuery dataTables與jQuery UI 對話框dialog的使用教程的相關(guān)資料,本文介紹的非常詳細,具有參考借鑒價值,需要的朋友可以參考下2016-09-09TextArea不支持maxlength的解決辦法(jquery)
自己寫了一個jquery的擴展,這樣就可以很容易實現(xiàn)對textarea控制最大長度了。2011-09-09jQuery 函數(shù)實例分析【函數(shù)聲明、函數(shù)表達式、匿名函數(shù)等】
這篇文章主要介紹了jQuery 函數(shù),結(jié)合實例形式分析了jquery函數(shù)聲明、函數(shù)表達式、匿名函數(shù)等相關(guān)使用技巧,需要的朋友可以參考下2020-05-05