Normalmente imposti larghezza e altezza per iframe. Se il contenuto all'interno è più grande, le barre di scorrimento devono essere sufficienti. Lo script seguente tenta di risolverlo ridimensionando dinamicamente l'iframe per adattarlo al contenuto che carica.
$(function()( var iFrames = $('iframe'); function iResize() ( for (var i = 0, j = iFrames.length; i < j; i++) ( iFrames(i).style.height = iFrames(i).contentWindow.document.body.offsetHeight + 'px';) ) if ($.browser.safari || $.browser.opera) ( iFrames.load(function()( setTimeout(iResize, 0); )); for (var i = 0, j = iFrames.length; i < j; i++) ( var iSource = iFrames(i).src; iFrames(i).src = ''; iFrames(i).src = iSource; ) ) else ( iFrames.load(function() ( this.style.height = this.contentWindow.document.body.offsetHeight + 'px'; )); ) ));
Ridimensionerà un iframe in questo modo:
Visualizza demo
Ancora problematico ...
- L'origine del contenuto dell'iframe deve risiedere nello stesso dominio
- se il contenuto all'interno dell'iframe cambia altezza, questo non si adatterà
- Ho lasciato il codice di Google Analytics fuori dalla demo sopra, poiché quando l'ho aggiunto sembra interferire e non ridimensionare l'iframe, nonostante apparentemente non generi errori.