auto resize the iframe !

[Walid]

1) Script Title: Ajax Tabs Content script v2.0

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tent/index.htm

3) Describe problem: CSS Problem in ajaxtabs.js file in line 16

this.defaultIframe='<iframe src="about:blank" allowtransparency="true" marginwidth="0" marginheight="0" frameborder="0" vspace="0" hspace="0" class="tabcontentiframe" style="width:100%; height:auto; min-height: 100px""></iframe>' 

Is it possible to set up the iframe so that it will auto size the frame window

page to the size of the inserted External page to be displayed ?

[Dal]

100px"" you have a double quote mark on the end of your style. the setting "auto" as far as divs go will adjust to the content, not sure about iframes (never used them)

[Walid]

100px"" you have a double quot

yeh thanks ... but still not working fine ...

is ther any css command to edit this problem ?

overflow:auto; not working !
height:auto; not working !

here the original css code:

style="width:100%; height:auto; min-height: 100px"

[Dal]

Im not sure but google to see if iframes support these css options. Im unaware of min-height but this could be specific for iframes.

wheels within wheels will always be a problem to solve however your problem is just with one "wheel" so Im sure its just a matter of looking up the iframe DOM properties and setting something in there, however if there is no such option then you may need to run a script within the child page to collect its dimensions and report it back to the parent.

[Walid]

any solution guys ... plz help

[willsmelser]

Unfortunately you cannot dynamically set height or width of an iframe for an external link. It can only be done for content hosted by your site.

The max-xxxx and min-xxxx properties are mozilla I believe and wont affect IE. The iframe will cutoff content unless you allow for scrolling on the iframe.

You may be able to write a server side script to download the page to your webserver and calcualte a height of the iframe from your server and then set the iframe height using scrollheight.

Hope this can help

[M.C.]

Hi all! use that script and try to autoadjust iframe verticaly, but... All pages what appear inside frame is on my local host....

OR may be explain me HOW to make links on inside pages to be opened inside same DIV?

I have

[1][2][3] tabs which open files:
1.htm
2.htm
3.htm

These files with links and are different height of page.
Links to pages 11.htm 22.htm & etc.

I need them to be opened in same iframe or DIV without main page to be reloaded. Ifraim is more helpfull becouse users can use "BACK" button, but iframe doesn't want to autoadjust height

Anyone can help me?

[rangana]

M.C., If I understood you correctly, your problem might be fix either of these choices:

• Don't use iframe. Instead use <div>s so that the content auto-adjust itself. If the problem is to show other page's content, then you could use PHP include(). You have all of them in one div, for instance wrapper, and have all of the divs within it. Something along these lines:
  

  <div id="wrapper">
      <div id="page1">
      <?php include('page1.htm'); ?>
      </div>
      
      <div id="page2">
      <?php include('page2.htm'); ?>
      </div>
      
      <div id="page3">
      <?php include('page3.htm'); ?>
      </div>
  </div>

  Where page1,page2 and page3 divs are hidden divs, and so they will only show when the user clicks the corresponding link.
  
• Other way to go is to keep up the iframe and force the iframe's height to change. See this code for basic example:
  

  <script type="text/javascript">
  window.onload=function(){
  var a=document.getElementsByTagName('a'); // Assign to variable a all the <a> elements
  a[0].onclick=function(){ /* First link */
  document.getElementById('myframe').style.height='300px';}
  a[1].onclick=function(){ /* Second link */
  document.getElementById('myframe').style.height='500px';}
  a[2].onclick=function(){ /* Third link */
  document.getElementById('myframe').style.height='800px';}}
  </script>
  <a href="http://www.dynamicdrive.com/forums" target="myframe">Page1</a>
  <a href="http://www.yahoo.com" target="myframe">Page2</a>
  <a href="http://www.msn.com" target="myframe">Page3</a><br><br>
  <iframe src="http://www.google.com" id="myframe" name="myframe" style="width:800px"></iframe>

Hope that helps.

[ddadmin]

MC:
To add to Rangara's suggestion on resizing the IFRAME depending on the page loaded inside it, there is a mod that lets you manually specify a different IFRAME height depending on the tab: http://www.dynamicdrive.com/forums/s...d.php?p=132566 I'm not aware of a mod that automatically resizes the IFRAME on the forums yet.

[M.C.]

rangana, thanks, but I don't use PHP on my pages it's internal website so... I have to use iframe...

there is one problem, your script doesn't change height dynamically! I have to put height for every page here:

.style.height='800px'

BUT problem is... I have 30 pages linked to tabs (tab_pages) and about 300 pages linked to tab_pages So... script will be very heavy (about 400 different pages with different height) for me... So... Is there any way script checks the size of page in link and adjust height of iframe DYNAMICALLY?

ddadmin I hope there will be one for me and there is... http://www.dynamicdrive.com/dynamici...iframessi2.htm
that works fine for me!