Link to home
Start Free TrialLog in
Avatar of jagku
jagkuFlag for United States of America

asked on

how to increase height of a parent div

Hello Experts,

I have 2 html files:

Parent:
            <div id="mainframe" style="height:120px; width:500px">                
                <iframe class="login" src="login.html" scrolling="no" frameborder="0" width="100%" height="100%" >
                </iframe>
             </div>  

Child: (login.html)

I call this script in the the <body onload>:

function resizeFrame()
{
      if ($('#mainframe',window.parent.document).length > 0)
      {      
            $('#mainframe',window.parent.document).attr("style","height:220px; width:500px");
      }      
}

The purpose of this script is to resize the div that wraps the iframe (as I need to float the iframe at the top of the screen).  For some reason my jquery isn't resizing the mainframe.  What am I doing wrong?

Thanks
Avatar of rawinnlnx9
rawinnlnx9
Flag of United States of America image

Try calling resizeFrame after the document fully loads. Of course then you'll need to cause the page to refresh with the changes. More jQuery can do that for you.

http://docs.jquery.com/Tutorials:Introducing_$(document).ready()

Read the above. It might solve your problem. It may introduce a new one though that the page needs to redraw. jQuery easily solves this so just Google jQuery and page refresh.
ASKER CERTIFIED SOLUTION
Avatar of jagku
jagku
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of jagku

ASKER

Actually, the way I was adjusting the height was incorrect. It should have been

eg
$('#mainframe',window.parent.document).height(320);