Solved

how to increase height of a parent div

Posted on 2011-03-01
3
800 Views
Last Modified: 2012-05-11
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
0
Comment
Question by:jagku
  • 2
3 Comments
 
LVL 9

Expert Comment

by:rawinnlnx9
ID: 35009575
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.
0
 

Accepted Solution

by:
jagku earned 0 total points
ID: 35009651
Hi,
I already call this when the page loads:

i.e. (login.html)
<body onLoad="resizeFrame();">

I have also tried putting the jquery wrapper
i.e.

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

However, the only thing that happens (when either are used) is the parent div closes - which leads me to believe that the way I am trying to adjust the height is wrong and maybe removing the height/width due to this.

Any other ideas?
0
 

Author Closing Comment

by:jagku
ID: 35045608
Actually, the way I was adjusting the height was incorrect. It should have been

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

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

911 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now