Page 1 of 1

resize iframe based on src content

Posted: Mon Jun 23, 2008 1:57 pm
by Luke
I am trying to re-size an iframe based on the actual content of its src so that no scrollbars are necessary. I am decent with client side stuff, but I have not been able to figure this one out... I've tried a hundred combination of things and nothing seems to work. The problem seems to come from the fact that the parent document doesn't know the content of the iframe before it is rendered... I can't figure out how to render it first and then adjust height. Anybody have any idea where I am going wrong?

Code: Select all

           $(function(){ // this function runs when this document is ready
                $("iframe").load(function(){ // this function is supposed to run when the iframe is loaded
                    var iframe = window.frames[$(this).attr("name")]; // get the iframe in question
                    var height = iframe.innerHeight;
                    alert(height); // does nothing
                    $(this).height(height); // set the iframe height to this height
                });
            });

Re: resize iframe based on src content

Posted: Mon Jun 23, 2008 2:48 pm
by Kieran Huggins
I'd put that js in the iframe itself - it can tell it's own document length and then instruct the iframe object in the parent frame to resize.

Should work, as far as I can tell.

Re: resize iframe based on src content

Posted: Mon Jun 23, 2008 3:07 pm
by Luke
Wow... great idea. 8O :)

Re: resize iframe based on src content

Posted: Mon Jun 23, 2008 5:00 pm
by Luke
This did the trick!

(I put this in the iframe src file)

Code: Select all

 
$(function(){
    if (top.location != self.location) {
        var height = $("body").height();
        iframe = top.document.getElementById("ssRemoteWindow");
        $(iframe).height(height + 20);
        $(iframe).attr("scrolling", "no");
    }
}
 

Re: resize iframe based on src content

Posted: Mon Jun 23, 2008 8:54 pm
by Kieran Huggins
wicked! I wasn't sure it would even work, but you nailed it :-)