Show and hide iframe that is sized to content
<p>Hey i have a iframe that i am sizing to its content with the following script. I want to show and hide this iframe with two buttons but when its hidden the iframes width and height is not calculated and so when i click the show button it does not show because the width and height are still set to 0. </p>

<p>I am pretty new to jquery and javascript so help would be greatly appreciated.</p>

<pre><code>&lt;script language="JavaScript"&gt;
$(document).ready(function(){
    $(".ShowFrame").click(function(){
        $("#iframe1").show();
    });
    $("#iframe1").hide();
});

function autoResize(id){
    var newheight;
    var newwidth;

    if(document.getElementById){
        newheight=document.getElementById(id).contentWindow.document .body.scrollHeight;
        newwidth=document.getElementById(id).contentWindow.document .body.scrollWidth;
    }

    document.getElementById(id).height= (newheight) + "px";
    document.getElementById(id).width= (newwidth) + "px";
}
&lt;/script&gt;
</code></pre>
