快捷導(dǎo)航

教你用jquery實現(xiàn)iframe自適應(yīng)高度

更新時間：2014年06月11日 11:11:25 作者：

iframe因為能和網(wǎng)頁無縫的結(jié)合從而不刷新頁面的情況下更新頁面的部分?jǐn)?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); 
}); 

您可能感興趣的文章:

相關(guān)文章

基于JQuery的密碼強度驗證代碼
密碼強度驗證的方式有很多，今天給大家推薦一個通過JQuery實現(xiàn)的密碼強度驗證控件，只需要很少的代碼便能實現(xiàn)。
2010-03-03
省市區(qū)三級聯(lián)動jquery實現(xiàn)代碼
這篇文章主要為大家詳細(xì)紹了省市區(qū)三級聯(lián)動jquery實現(xiàn)代碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2016-10-10
用jquery實現(xiàn)學(xué)校的校歷(asp.net+jquery ui 1.72)
學(xué)校日歷有以下幾個特點：1顯示本周是本學(xué)期的第幾周；2顯示今日事件；3特殊顯示有事件的日期，點擊該日期顯示本日事件。
2010-01-01
jquery制作漂亮的彈出層提示消息特效
這篇文章主要介紹了jquery制作漂亮的彈出層提示消息特效,需要的朋友可以參考下
2014-12-12
文本框只能選擇數(shù)據(jù)到文本框禁止手動輸入
文本框只能上人家選擇數(shù)據(jù)進(jìn)去，不能手動輸入，經(jīng)搜索研究發(fā)現(xiàn)個不錯的解決方法，感興趣的朋友可以參考下
2013-11-11
深入探秘jquery瀑布流的實現(xiàn)
瀑布流就是像瀑布一樣的網(wǎng)站——豐富的網(wǎng)站內(nèi)容，特別是絢美的圖片會讓你流連忘返。你在瀏覽網(wǎng)站的時候只需要輕輕滑動一下鼠標(biāo)滾輪，一切的美妙的圖片精彩便可呈現(xiàn)在你面前。瀑布流網(wǎng)站是新興的一種網(wǎng)站模式——她的典型代表是pinterest、美麗說、蘑菇街這類型的網(wǎng)站。
2016-01-01
多種JQuery循環(huán)滾動文字圖片效果代碼
這篇文章主要為大家提供了多種JQuery循環(huán)滾動文字圖片效果代碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2016-02-02
基于jQuery實現(xiàn)的水平和垂直居中的div窗口
在建立網(wǎng)頁布局的時候，我們經(jīng)常會面臨一個問題，就是讓一個div實現(xiàn)水平和垂直居中，雖然好幾種方式實現(xiàn)，但是今天介紹時我最喜歡的方法，通過css和jQuery實現(xiàn)。
2011-08-08
jQuery 拖動層(在可視區(qū)域范圍內(nèi))
獲取層元素，在瀏覽器可視區(qū)域的最左、最邊，最上、最下的值。并且在拖動層的過程中，把當(dāng)前層的坐標(biāo)值，去和這幾個值，做比較，如果超過這些值。那么就不能再拖動這個方向，即把值設(shè)為最小或最大
2012-05-05
jQuery 中的 DOM 操作
在DOM操作中，常常需要動態(tài)創(chuàng)建HTML內(nèi)容，使文檔在瀏覽器里的呈現(xiàn)效果發(fā)生變化，并且達(dá)到各種各樣的人機交互目的.
2016-04-04