[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

how to resize iframe in javascript function

Posted on 2001-07-05
6
Medium Priority
?
177 Views
Last Modified: 2012-05-04
Hallo guys, i have something problem. i have a webpage that have hypperlink and iframe.
i want each time i klik the hyperlink then the information show in iframe and i had already done this but i have some problem. each hyperlink has a diffrenet data include the size. i want each time the data changes then the iframe size is changes depent on data that show. can you help me?  
0
Comment
Question by:turboplus
  • 3
  • 2
6 Comments
 
LVL 22

Expert Comment

by:CJ_S
ID: 6258685
Add the following to the pages being loaded in the iframe

right after the <body>:
<div id='p'>

and right before the </body>:
</div>

Now add the following scripting to the page being loadeD:

function document_onload()
{
   h = document.all["p"].offsetHeight;
   top.document.all["iframename"].height = h;
}
window.onload=document_onload;

regards,
CJ
0
 

Author Comment

by:turboplus
ID: 6258802
soory its doesn't work. i want to make clear this problem. i want to resize iframe in the "window" without reload / refresh that page. is it possible?  
0
 
LVL 3

Accepted Solution

by:
davlun20080 earned 200 total points
ID: 6260050
If you know the size you want the iframe to be, then yes you can resize the frame through script from the main page like this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script language="javascript">
     function resizeIframe(w, h)
     {
          document.all("bob").style.width = w
          document.all("bob").style.height = h
     }
</script>
</HEAD>

<BODY BGCOLOR="#FFFFFF">
<iframe id="bob" style="position:absolute;top:140; left:100; width:100; height:100"></iframe>
<input type="button" value="click to resize" onclick="resizeIframe(250, 250)">
</BODY>
</HTML>

If that data is contained in the page that is being loaded, you can use this script placed in each page you load into the iframe:
<script language="javascript">
    var width = 350
    var height = 350

    function resize()
    {
       top.resizeIframe(width, height)
    }
    window.onload = resize()
</script>
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 3

Expert Comment

by:davlun20080
ID: 6260078
Change the second script to:
<script language="javascript">
   var width = 350
   var height = 350

   function resizeit()
   {
      top.resizeIframe(width, height)
   }
   document.onload = resizeit()
</script>

Bad form to use words that have other meanings for function names (and i needed to correct that darn window.onload to document.onload)

davlun
0
 

Author Comment

by:turboplus
ID: 6263573
Thanks so much. You have give me so detail.
0
 
LVL 3

Expert Comment

by:davlun20080
ID: 6266241
no problem, glad to help.
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

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

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
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)
The viewer will learn the basics of jQuery including how to code hide show and toggles. 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…
Suggested Courses

830 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