Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

how to resize iframe in javascript function

Posted on 2001-07-05
6
Medium Priority
?
175 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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
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.

 
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

Tech or Treat!

Submit an article about your scariest tech experience—and the solution—and you’ll be automatically entered to win one of 4 fantastic tech gadgets.

Question has a verified solution.

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

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
A while back, I ran into a situation where I was trying to use the calculated columns feature in SharePoint 2013 to do some simple math using values in two lists. Between certain data types not being accessible, and also with trying to make a one to…
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…

636 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