Az iframe-ekhez általában a szélességet és a magasságot állítja be. Ha a belső tartalom nagyobb, a gördítősávoknak elegendőnek kell lenniük. Az alábbi szkript megpróbálja kijavítani ezt azáltal, hogy dinamikusan átméretezi az iframe-et a betöltött tartalomhoz.
$(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'; )); ) )); Átméretezi egy ilyen iframe-et:
Demo megtekintése
Még mindig problémás ...
- Az iframe-tartalom forrásának ugyanabban a tartományban kell lennie
- ha az iframe-en belüli tartalom magasságot változik, ez nem fog alkalmazkodni
- Hagytam a Google Analytics kódot a fenti demóból, mivel amikor hozzáadtam, úgy tűnik, hogy beavatkozik és nem méretezi át az iframe-et, annak ellenére, hogy látszólag nem generált hibákat.