建站知識
網(wǎng)站設(shè)計知識 網(wǎng)站建設(shè)知識 網(wǎng)絡(luò)營銷知識 微信資訊 常見問題 網(wǎng)站備案 近期客戶網(wǎng)站建設(shè)套餐
標(biāo)準(zhǔn)型網(wǎng)站建設(shè) 精美型網(wǎng)站建設(shè) 營銷型網(wǎng)站建設(shè) 高端品牌網(wǎng)站建設(shè) 電子商務(wù)型網(wǎng)站建設(shè) 行業(yè)門戶型網(wǎng)站建設(shè) 手機(jī)網(wǎng)站建設(shè) 微信網(wǎng)站建設(shè)怎樣讓超過iframe框架高度限定自動隱藏呢?
來源:征帆網(wǎng)絡(luò) 作者:ymars 日期:2014-12-11
征帆網(wǎng)絡(luò)小編最近在排版時發(fā)現(xiàn)iframe框架中的表單超過其框架高度后不知道應(yīng)該怎么被自動隱藏,相信也有其他朋友同樣遇到過這種問題,那么我們就一起來探究下應(yīng)該怎樣實現(xiàn)這個問題吧,以下是小編經(jīng)過千辛萬苦(有點(diǎn)夸大了啊,嘻嘻)才找到的一個解決方法:
<script type="text/javascript">
$(document).ready(function()
{
// Set specific variable to represent all iframe tags.
var iFrames = document.getElementsByTagName_r('iframe');
// Resize heights.
function iResize()
{
// Iterate through all iframes in the page.
for (var i = 0, j = iFrames.length; i < j; i++)
{
// Set inline style to equal the body height of the iframed content.
iFrames[i].style.height = iFrames[i].contentWindow.document.body.offsetHeight + 'px';
}
}
// Check if browser is Safari or Opera.
if ($.browser.safari || $.browser.opera)
{
// Start timer when loaded.
$('iframe').load(function()
{
setTimeout(iResize, 0);
}
);
// Safari and Opera need a kick-start.
for (var i = 0, j = iFrames.length; i < j; i++)
{
var iSource = iFrames[i].src;
iFrames[i].src = '';
iFrames[i].src = iSource;
}
}
else
{
// For other good browsers.
$('iframe').load(function()
{
// Set inline style to equal the body height of the iframed content.
if(this.contentWindow.document.body.offsetHeight>1000)
{
this.style.height = 700 + 'px';//此處為最小高度的設(shè)置
}else{
this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
}
}
);
}
}
);
</script>
看的懂么?哈哈,其實也不用看懂,只要把上述文件外加一個jquery文件一起加載下,你會發(fā)現(xiàn)你想要的效果已經(jīng)出現(xiàn)了...
<script type="text/javascript">
$(document).ready(function()
{
// Set specific variable to represent all iframe tags.
var iFrames = document.getElementsByTagName_r('iframe');
// Resize heights.
function iResize()
{
// Iterate through all iframes in the page.
for (var i = 0, j = iFrames.length; i < j; i++)
{
// Set inline style to equal the body height of the iframed content.
iFrames[i].style.height = iFrames[i].contentWindow.document.body.offsetHeight + 'px';
}
}
// Check if browser is Safari or Opera.
if ($.browser.safari || $.browser.opera)
{
// Start timer when loaded.
$('iframe').load(function()
{
setTimeout(iResize, 0);
}
);
// Safari and Opera need a kick-start.
for (var i = 0, j = iFrames.length; i < j; i++)
{
var iSource = iFrames[i].src;
iFrames[i].src = '';
iFrames[i].src = iSource;
}
}
else
{
// For other good browsers.
$('iframe').load(function()
{
// Set inline style to equal the body height of the iframed content.
if(this.contentWindow.document.body.offsetHeight>1000)
{
this.style.height = 700 + 'px';//此處為最小高度的設(shè)置
}else{
this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
}
}
);
}
}
);
</script>
看的懂么?哈哈,其實也不用看懂,只要把上述文件外加一個jquery文件一起加載下,你會發(fā)現(xiàn)你想要的效果已經(jīng)出現(xiàn)了...
相關(guān)文章列表