Изменение размера iFrame, чтобы соответствовать содержимому, получив scrollHeight (javascript)

Question

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

function resizeIFrame(){ 

    var sHeight, frame; 

     frame = document.getElementById("bigFrame"); 
     sHeight = frame.scrollHeight; 
     frame.style.height = sHeight + 'px'; 
    } 

Когда я предупрежу эту переменную sHeight я получить высоту рамы, а не scrollHeight. Это указывает на то, что я не могу правильно собирать scrollHeight.

Я знаю, что этот вопрос может быть похож на многие ранее, но есть много способов подойти к этой проблеме и более широкий спектр ответов. Я хотел бы знать, что не так с этим подходом к изменению размера iframes для соответствия содержимому?

Это html.

<div id="contentContainer"> 
     <iframe id="bigFrame" 
       src="home/home.html" 
       name="mainFrame"  
       onload="resizeIFrame()" 
       onresize="resizeIFrame()" 
       scrolling="no" 
       seamless; > 
      </iframe> 
    </div> 

Answer 1

Ok Я получил эту работу отлично.
Добавление - contentWindow.document.body.scrollHeight - позволило мне получить scrollHeight. Я пытался получить scrollHeight из переменной. Это не сработало. То, что работало, заключалось в том, чтобы заставить scrollHeight прямо из документа.

Мне нужно было добавить некоторое пространство внизу каждой страницы. Таким образом, +80 ;. К сожалению, это только добавило 80 при каждом вызове функции. Сброс высоты кадра до 0px до перенастройки устранил проблему.

Итак, вы идете. Эта функция изменяет размер iframe, чтобы соответствовать его содержимому, получив scrollHeight и установив высоту iframes.

function resizeIFrame(){ 

     var sHeight, frame; 

      frame = document.getElementById("bigFrame"); 
      frame.style.height = '0px'; 
      sHeight = document.getElementById('bigFrame'). 
        contentWindow.document.body.scrollHeight + 80; 
      frame.style.height = sHeight + 'px'; 
    } 

Answer 2

Попробуйте с

frame.style.height = sHeight + 'px';