Как задать Iframe полную высоту?

Question

У меня есть Iframe, (для ясности это кейс портфолио) мне нужно вставить его в страницу и задать ему полную высоту его-же содержимого.

Внутри фрейма есть некоторые блоки которым задана высота 100vh. Если я делю высоту ифрейма с помощью этого кода:

$("#template_case_anse").height($("#template_case_anse").contents().find("html body").height());

То 100vh превращается в очень большую высоту, как это обойти или как сделать по уму, то что я запланировал. Внутри Iframe мне нужно чтобы осталась высота 100vh, но при этом юзер не должен чувствовать что это iframe.

Answer 1

Для корректной работы у вас должны быть настроены:

<iframe id="iframe" src="..." frameborder="0"></iframe>
<script>

  var iframe = document.getElementById('iframe');
  if (iframe) {

    function updateIframe() {
      iframe.style.height = iframe.contentWindow.document.body.offsetHeight + 'px';
    }

    iframe.addEventListener('load', function() {
      window.addEventListener('resize', function() {
        updateIframe();
      });
      updateIframe();
    });

  }

</script>

БЛОГ НА HUSL

Как задать Iframe полную высоту?

Ответы (1 шт):