Re-sizing site's Body and iframe when the page link is clicked

I have an iframe that loads a page inside it.. when a link is clicked on the page in the iframe, resize the body of the parent aka the document that has the iframe's body..

 Body         <------------------------
    Iframe                            |
        Page                          |
         Link... Upon Click, resize body --

How do I do the above? I tried Parent.document.body.style.width = "200px". and it didn't work. Not sure what to do. Please Help!

function Parentresize(id)
{
var newheight = 2000;
var newwidth = 2000;
parent.document.getElementById(id).height= (newheight) + "px";
parent.document.getElementById(id).width= (newwidth) + "px";
}

Answers


I think you have missed the style.height and style.width

This is the code I used in iframe

<script language="javascript">
    function Parentresize(id)
    {
        alert("U r there");
        var newheight = 200;
        var newwidth = 200;
        parent.document.getElementById(id).style.height = newheight + "px";
        parent.document.getElementById(id).style.width = newwidth + "px";
    }
</script>


<a href="javascript:Parentresize('sam');" >Call Me </a>

Ok I figured it out. This code will exactly do that. It is a bit lengthy because of extra code for cross browser compatibility:

function WindowSize()
{
    WinWidth = 0, WinHeight = 0;    //Initialize variables with a value of 0;
    if(typeof(parent.window.innerWidth) == 'number')    //Well I need the parent width of the iFrame aka browser width. Width is a number, not undefined..
    {
            //FireFox/Opera..
        WinWidth = parent.window.innerWidth;
        WinHeight = parent.window.innerHeight;
    }
    else if(parent.document.documentElement && (parent.document.documentElement.clientWidth || parent.document.documentElement.clientHeight))
    {
        //IE 6+
        WinWidth = parent.document.documentElement.clientWidth;
        WinHeight = parent.document.documentElement.clientHeight;
    }
    return WinWidth;
}

function BodyResize(ID)
{
    var IDTag = parent.document.getElementById(ID);

    if(IDTag.clientWidth == '1024')
        IDTag.style.width = (WindowSize() + 'px');
    else
        IDTag.style.width = '1024px';
}

just call this function BodyResize(ID) as <body id="mainbody" onClick="BodyResize('mainbody')"> or <iframe id="interframe" onClick="BodyResize('interframe')">


Need Your Help

How to load a python module into a fresh interactive shell in Komodo?

python shell interpreter komodo

When using PyWin I can easily load a python file into a fresh interactive shell and I find this quite handy for prototyping and other exploratory tasks.

For what exactly @XXXXX is used for?

java syntax jboss

Beginner's question. I see a lot of @XXXXX s in our code base. So I would like to know what is the significance of this syntax.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.