Установите высоту iframe по отношению к внутреннему контенту (в том же домене)

У меня встроенный iframe на моей странице - это только часть моей страницы, а не все. Я перезагружаю iframe динамически и хочу, чтобы он изменялся в соответствии с высотой содержимого внутри него.Установите высоту iframe по отношению к внутреннему контенту (в том же домене)

Содержимое доступно в том же доменном классе, так что (надеюсь?) Не нужно такое сложное решение, как задано в Resizing an iframe based on content.

Это код, который я использую для его изменения, но он не работает. Кадр перезагружается нормально, но высота всегда остается неизменной. Может ли кто-нибудь посоветовать?

Я также пробовал верхнее решение в How to autosize an iframe без везения.

Я думаю, это может быть потому, что страница внутри iframe занимает некоторое время, чтобы загрузить, поэтому она не закончила загрузку к тому времени, когда установлена высота. Может быть.

<iframe frameborder=0 border=0 src="" width="100%" height="400px" name="commentframe" id="commentframe"></iframe> 
function reload_frame(uid) { 
    document.getElementById('commentframe').src = "comments.html?" + uid; 
    document.getElementById('commentframe').height = document.getElementById('commentframe').contentWindow.document.body.scrollHeight + "px"; 
}

Update:

Попытка, не повезло:

<iframe frameborder=0 border=0 src="" width="100%" height="400px" name="commentframe" id="commentframe" onload="reload_frame()"></iframe> 
function reload_frame() { 
     var commentframe = document.getElementById('commentframe'); 
     commentframe.style.height = (commentframe.scrollHeight + 10).toString() + "px"; 
}

Это делает изменить размер IFRAME, но только до + 10px своей первоначальной высоты - если содержание больше, чем это, он по-прежнему скрыт.

Возможно, мне нужно событие onload внутри тела самого iframe?

источник

2010-10-01 AP257

изменить 'комментарийframe.style.height' на' commentframe.height' (в разделе 'update'). – alfasin

<script type="text/javascript"> 
    function ajustHeight() { 
     $("#myIframe").parent()[0].style.height = ($("#myIframe")[0].scrollHeight + 150).toString() + "px"; 
    } 
</script> 
<iframe id="myIframe" src="mypage.html" width="100%" height="100%" onload="ajustHeight()"></iframe>

источник

2010-10-01 19:55:15 Zote

почему +150? что мы ожидаем здесь? – lincolnk

Спасибо! Есть ли способ записать его в обычный Javascript без jquery? Я просто пытаюсь перевести ... – AP257

Что делает вызов parent()? Мой iframe не находится внутри содержащего div (и, пожалуйста, обратите внимание, что это не единственная вещь на странице ...), и что именно имеет его высота? – AP257

-1

без JQuery:

<script type="text/javascript"> 
    window.onload = function() { 
     var iframe = document.getElementById("blogFrame"); 
     iframe.parentNode.style.height = iframe.scrollHeight + "px"; 
    } 
</script>

источник

2013-05-09 17:40:47 Berty

В современных браузерах и со многим DOCTYPES, scrollHeight возвратит высоту IFrame вычисленной в браузере и не высоту содержимого, поэтому выше фрагменты кода не будут работать в большинстве случаев.

Вы можете установить iframe на высоту содержимого, используя следующий фрагмент.

JS:

$('#ifm').load(function() { 
    $(this).height($(this)[0].contentWindow.document.body.scrollHeight + 24); 
});

HTML:

<iframe id="ifm src="..."></iframe>

Пожалуйста, обратите внимание, что это будет работать только если IFrame URL находится на точно такой же домен страницы, содержащей сам IFRAME.

источник

2016-07-01 08:48:05

Установите высоту iframe по отношению к внутреннему контенту (в том же домене)

ответ

Смежные вопросы