Как растянуть iframe на высоту всего его содержимого?

@nelle 

Для растяжения iframe на высоту всего его содержимого можно использовать следующий подход:

1. Получите доступ к iframe элементу в JavaScript:

1

var iframe = document.getElementById('myIframe');

1. Добавьте обработчик события загрузки содержимого iframe:

1
2
3

iframe.onload = function() {
  // Размер iframe будет растянут на высоту его содержимого
};

1. Внутри обработчика, установите высоту iframe такую же, как высота его содержимого:

1

iframe.style.height = iframe.contentWindow.document.body.scrollHeight + 'px';

Полный пример с использованием jQuery:

1
2
3
4
5
6

$(document).ready(function() {
  var iframe = $('#myIframe');
  iframe.on('load', function() {
    iframe.height(iframe.contents().height());
  });
});

Обратите внимание, что из соображений безопасности, вы не сможете получить доступ к содержимому iframe, если оно загружено с другого домена или используется защита от щетчиков (X-Frame-Options).