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

Question

Я использую следующий скрипт для автоматической настройки высоты iframe.

function autoIframe(frameId) { 
    try { 
    frame = document.getElementById(frameId); 
    innerDoc = (frame.contentDocument) ? 
       frame.contentDocument : frame.contentWindow.document; 
    objToResize = (frame.style) ? frame.style : frame; 
    objToResize.height = innerDoc.body.scrollHeight + 10 + 'px'; 
    } 
    catch (err) { 
    window.status = err.message; 
    } 
} 

У меня есть три вкладки Jquery и встроенных в первые две вкладки (myiframe1 и myiframe2)

Я зову выше код на OnLoad из фреймов нравится.

<iframe id="myiframe1" width="100%" onload="autoIframe('myiframe1');" 
     scrolling="auto" frameborder="0" src="mypath1"> 
</iframe> 

<iframe id="myiframe2" width="100%" onload="autoIframe('myiframe2');" 
     scrolling="auto" frameborder="0" src="mypath2"> 
</iframe> 

Это прекрасно работает в Google Chrome и IE8. Но в firefox iframe на первой вкладке (видимая вкладка) имеет высоту по содержанию, а iframe во второй вкладке не задана с соответствующей высотой. Высота второй вкладки установлена ​​равной 10px.

В чем проблема?

Answer 1

Элементы display:none имеют высоту 0 iirc, но jquery предлагает способ «не скрывать, а перемещать вкладку с экрана».

Вы можете найти документацию/пример здесь:

jquery ui docs - tabs - faq

Answer 2

вы можете попробовать это:

выберите вкладку фрейма, который вы хотите изменить размер первого (так что, когда он стал виден он получает высоту), а затем выбрать вкладку первый (текущий) снова:

$('#tabs').tabs('select', 2); 
// adjust second tab iframe height here 
$('#tabs').tabs('select', 1); 

(возможно, высота невидимого/невыбранного содержимого вкладки равна 0, поэтому изменение размера не будет работать).