auto resize iframe height

AnthonyB

09-02-2006, 12:42 PM

Hi there,

I am looking to retrieve the hieght of the browser window, so that when my index page loads, it will automatically resize an iframe that i have to fill the remaining hieght of the window.

http://img179.imageshack.us/img179/5760/image1qu5.th.jpg (http://img179.imageshack.us/my.php?image=image1qu5.jpg)

The image above shows the location of the iframe, and the problem that i am facing. Currently, the height of the iframe is hardcoded. On my laptop screen the iframe looks as if it fills the remaining 100% of the height. However, when viewing this page on my 17in monitor, there is now an ugly white space. I would like to be able to dynamically change the height of the iframe, so that it can fill up that white space with more iframe height.

(1) shows the current hard-coded height of the iframe, and (2) shows the height that i would like to be able to retrieve using javascript.

If i can get this value, then i assume all i then need to do is to substract the number of pixels that are taken up by the image, and the two nav bars at the top. Hopefully this would then give me the iframe filling up all available white space.

The code i have currently to set the iframe height is:

<script type="text/javascript">

function setIframeHeight(iframeName) {
var iframeWin = window.frames[iframeName];
var iframeEl = document.getElementById? document.getElementById(iframeName): document.all? document.all[iframeName]: null;
if ( iframeEl && iframeWin ) {
iframeEl.style.height = "auto"; // helps resize (for some) if new doc shorter than previous
//var docHt = getDocHeight(iframeWin.document);
// need to add to height to be sure it will all show
iframeEl.style.height = 100 + "%";
alert(document.height);
}
}
</script>

</head>

<body onload="setIframeHeight('ifrm');">

So, I am now able to change the height of the iframe when the page loads, i just now need to hopefully be able to get the value from (2) in the image, to make it all work out nicely.

Is this possible? Any help or advice will be greatly appreciated!

Thanks in advance :)

AnthonyB

09-02-2006, 01:34 PM

Great!

I managed to find a solution to my problem :)

The new code that gets the browswer window height (depending on the browser client) and updates the iframe height is:

<script type="text/javascript">
function setIframeHeight(iframeName) {
//var iframeWin = window.frames[iframeName];
var iframeEl = document.getElementById? document.getElementById(iframeName): document.all? document.all[iframeName]: null;
if (iframeEl) {
iframeEl.style.height = "auto"; // helps resize (for some) if new doc shorter than previous
//var docHt = getDocHeight(iframeWin.document);
// need to add to height to be sure it will all show
var h = alertSize();
var new_h = (h-148);
iframeEl.style.height = new_h + "px";
//alertSize();
}
}

function alertSize() {
var myHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myHeight = document.body.clientHeight;
}
//window.alert( 'Height = ' + myHeight );
return myHeight;
}
</script>

</head>

<body onload="setIframeHeight('ifrm');">

Incase anyone else has the same probs.

Now, for a different question...

Is it possible to auto detect changes to the browser window height? For example, if someone resizes the window with the mouse, or in the case of FF if someone opens a new tab, (in my case anyway, when there is only one 'tab', then the tab navbar is not shown... so if a new tab is created then the tab navbar is shown, which slightly reduces the overal window height), or even if someone does a quick find on the page?

Would it then be possible to detect any changes and auto update the ifram window again?

I think gmail is all js, and responds to when the browser is resized... but dunno if thats similar to what i want to do

Thanks in advance :)

vwphillips

09-02-2006, 02:40 PM

AnthonyB

09-02-2006, 05:05 PM

Lol, so simple!

Thanks for helping me out :)

mostafa

09-03-2006, 07:25 AM

This is a very good script

mostafa

09-03-2006, 07:28 AM

This is a very good script

<html>
<script type="text/javascript">
function autoIframe(frameId){
try{
frame = document.getElementById(frameId);
innerDoc = (frame.contentDocument) ? frame.contentDocument : frame.contentWindow.document;
objToResize = (frame.style) ? frame.style : frame;
objToResize.height = innerDoc.body.scrollHeight + 10;
}
catch(err){
window.status = err.message;
}
}
</script>

<body>

<iframe id="tree" name="tree" src="tree.htm" onload="if (window.parent && window.parent.autoIframe) {window.parent.autoIframe('tree');}"></iframe>

</body>

</html>

fasa

09-10-2006, 09:58 AM

vwphillips

09-10-2006, 10:18 AM

are you sure you have assigned an ID, not just a 'name' attribute.

They are different but IE is IE

fasa

09-10-2006, 10:35 AM

Oh, it was the problem. I defines just name in iframe tag. You are really expert!

monclee

09-15-2006, 08:42 PM

hye im really basics on java script ¿where do i have to replace the name or the id of my iframe? or ¿Based on this code, what should be the name of my iframe?.

and

how does it look the code of my iframe.

it looks like this.

<iframe src="Bienvenido.html" width="697" height="455" id="main" name="main" frameborder="0" scrolling="auto" >Su navegador no soporta Iframe, intenta con una versión mas nueva. Promo Club. </iframe>

monclee

09-15-2006, 09:02 PM

by the way the only thing i need its a basic java to load a page inside my iframe adjusting the height of each page. the width its not a problem.

And sorry for my bad english. thats also a problem learning java :S:rolleyes:

monclee

09-15-2006, 09:41 PM

i keep writing because im desperate i never publish opn forums until i have tried the last option :( no one its working, i have searched for tutorials, basic java, tried overa 1000 codes an nothing.

I hope this forum save my life.

and sorry for multiple replay but i wanna let clear im not one of those guys just keep asking i always search before posting

_Aerospace_Eng_

09-15-2006, 09:52 PM

Where are you calling autoIframe()? Did you read post #3? http://www.codingforums.com/showpost.php?p=482752&postcount=3
Seriously good things never come to impatient people. Just wait like everyone else until you get an answer. Don't keep posting.

monclee

09-15-2006, 10:20 PM

sorry not everybody is an expert like u :(.

i keep writing because im desperate i never publish opn forums until i have tried the last option no one its working, i have searched for tutorials, basic java, tried overa 1000 codes an nothing.

Did you read post #3? http://www.codingforums.com/showpost...52&postcount=3

yes ive tried that to. thanks :)

suggestions

monclee

09-15-2006, 11:13 PM

(ashamed) Sorry really but Im eating thanks to my page. I havent sleep. Im sorry I never meant to be a fool on java. Im trying to learn.

BUT I DID IT¡¡¡¡¡ I just need this code work on Firefox thanks. I wont post anymore.

well heres the code i found whats wrong?¡¡¡¡

<script type="text/javascript">

/***********************************************
* IFrame SSI script II- © Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
* Visit DynamicDrive.com for hundreds of original DHTML scripts
* This notice must stay intact for legal use
***********************************************/

//Input the IDs of the IFRAMES you wish to dynamically resize to match its content height:
//Separate each ID with a comma. Examples: ["myframe1", "myframe2"] or ["myframe"] or [] for none:
var iframeids=["main"]

//Should script hide iframe from browsers that don't support this script (non IE5+/NS6+ browsers. Recommended):
var iframehide="yes"

var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 16 : 0 //extra height in px to add to iframe in FireFox 1.0+ browsers

function resizeCaller() {
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++){
if (document.getElementById)
resizeIframe(iframeids[i])
//reveal iframe for lower end browsers? (see var above):
if ((document.all || document.getElementById) && iframehide=="no"){
var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
tempobj.style.display="block"
}
}
}

function resizeIframe(frameid){
var currentfr=document.getElementById(frameid)
if (currentfr && !window.opera){
currentfr.style.display="block"
if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight;
else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
currentfr.height = currentfr.Document.body.scrollHeight;
if (currentfr.addEventListener)
currentfr.addEventListener("load", readjustIframe, false)
else if (currentfr.attachEvent){
currentfr.detachEvent("onload", readjustIframe) // Bug fix line
currentfr.attachEvent("onload", readjustIframe)
}
}
}

function readjustIframe(loadevt) {
var crossevt=(window.event)? event : loadevt
var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
if (iframeroot)
resizeIframe(iframeroot.id);
}

function loadintoIframe(iframeid, url){
if (document.getElementById)
document.getElementById(iframeid).src=url
}

if (window.addEventListener)
window.addEventListener("load", resizeCaller, false)
else if (window.attachEvent)
window.attachEvent("onload", resizeCaller)
else
window.onload=resizeCaller

</script>

</head>

<iframe id="main" name="main" src="Bienvenido.html" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" vspace="0" hspace="0" style="overflow:visible; width:697px ; display:none"></iframe>

_Aerospace_Eng_

09-16-2006, 05:06 AM

Post a link to your site.

monclee

09-17-2006, 09:04 PM

www.promoclubmexico.com/mexico/queretaro/index.php

Just need the code to work on Firefox because the code works perfectly on IE, but its not jet published (the ie code). So thanks if you can help me out whit a code for firefox, because i just found a lot of codes all for IE. :(

Thanks:thumbsup:

ronambonfim

05-30-2007, 04:35 PM

Hello, for a long time I was looking for "resize iframe" and fix bugs when new page are shorter than the previous.

I know that is not an elegant way to do it, but it works, if someone else knows how to do it better, please show me.

*** CODE - parent page ***
<head>
...
<script>
function change_height() {
if(document.getElementById && !(document.all)) {
height = "1px";
document.getElementById(framename).style.height = height;
height = document.getElementById(framename).contentDocument.body.scrollHeight;
document.getElementById(framename).style.height = height;
}
else if(document.all) {
height = "1px";
document.all.framename.style.height = height;
height = document.frames(framename).document.body.scrollHeight;
document.all.framename.style.height = height;
}
}
<script>

...

</head>
<body>
...
<iframe onload="change_height()" src="iframepage.htm" style="width:100%;" name="framename" frameborder="no" scrolling="no" marginwidth="0" marginheight="0" id="framename"></iframe>
...
</body>
...

**** CODE ****

see you guys....:thumbsup:

mswanndeford

05-31-2007, 09:48 PM

I used Anthony's code:

<script type="text/javascript">

function setIframeHeight(energysaver) {
var iframeWin = window.frames[energysaver];
var iframeEl = document.getElementById? document.getElementById(energysaver): document.all? document.all[energysaver]: null;
if ( iframeEl && iframeWin ) {
iframeEl.style.height = "auto"; // helps resize (for some) if new doc shorter than previous
//var docHt = getDocHeight(iframeWin.document);
// need to add to height to be sure it will all show
iframeEl.style.height = 100 + "%";
alert(document.height);
}
}
</script>

<body onload="setIframeHeight('ifrm');">

<iframe name="energysaver" id="energysaver" frameborder="0" vspace="0" hspace="0" marginwidth="0" marginheight="0" width="800" height="100%" src="http://www.energyguide.com/redirect.asp?referrerid=236&sid=461" scrolling="no" style="overflow:visible"></iframe>

And I am having no luck...any suggestions? :confused:

BubikolRamios

10-12-2008, 11:05 PM

using code from anthony b, looks good so far, works ok , except in IE6. If I load some page of wiki, the vertical scroll bar dissapears in a split of second, and I cant scroll. if I load forinstance this page(cooding f.), or some of my contence, it is ok. In FF, no problem eitherway.

Edit: IE7 same as IE6.

Anyone knows what would be the reason ?

BubikolRamios

10-13-2008, 06:40 AM

the answer to this is:
change
scroll = 'yes'
to
scroll = 'auto'

and now it is ok on FF and IE

themba

04-06-2009, 04:10 PM

themba

04-06-2009, 04:11 PM

any ideas please? :o

sunilrajkg

05-22-2009, 09:33 AM

Hi everyone,

The below code might help you.
It works well in both Firefox and IE all versions.

Code:

function setIframeHeight(iframeName) {
var iframeEl = document.getElementById? document.getElementById(iframeName): document.all? document.all[iframeName]: null;
if (iframeEl) {
iframeEl.style.height = "auto";
// need to add to height to be sure it will all show
var h = alertSize(iframeName);
iframeEl.style.height =h + "px";
}
}

function alertSize(frameId) {
var myHeight = 0;
frame = document.getElementById(frameId);
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1];
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 16 : 0;
myHeight=frame.contentDocument.body.offsetHeight+FFextraHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'

innerDoc = (frame.contentDocument) ? frame.contentDocument : frame.contentWindow.document;
myHeight= innerDoc.body.scrollHeight + 10;
//myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myHeight = document.body.clientHeight;
}
//window.alert( 'Height = ' + myHeight );
return myHeight;
}

Iframe tag:

<iframe id="boardframe" scrolling="auto" name="boardiframe" width="600" frameborder="0" src="http://yourdomain.com/Comments.aspx?id=xxx" onload="setIframeHeight('boardframe');"></iframe>

Cheers
Sunil

sunilrajkg

05-22-2009, 09:38 AM

see the reply and tell me if it was helpful for u...

G__

06-29-2009, 11:03 PM

Hi,

So far this is the only script that works for IE and Safari. I can't get it to fully work with Firefox. It does not fully expand the iFrame when needed like IE.
Sorry I can't post the site yet. I am working on this locally.
Anything need to be tweaked for Firefox 3.0.11 for the below script?
Thanks to all for the posts and help.
G.

This is the code I am using at this time:

<script type="text/javascript">
function setIframeHeight(iframeName) {
var iframeEl = document.getElementById? document.getElementById(iframeName): document.all? document.all[iframeName]: null;
if (iframeEl) {
iframeEl.style.height = "auto";
// need to add to height to be sure it will all show
var h = alertSize(iframeName);
iframeEl.style.height =h + "px";
}
}

function alertSize(frameId) {
var myHeight = 0;
frame = document.getElementById(frameId);
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1];
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 16 : 0;
myHeight=frame.contentDocument.body.offsetHeight+FFextraHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'

innerDoc = (frame.contentDocument) ? frame.contentDocument : frame.contentWindow.document;
myHeight= innerDoc.body.scrollHeight + 10;
//myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myHeight = document.body.clientHeight;
}
//window.alert( 'Height = ' + myHeight );
return myHeight;
}

</script>

<iframe id="boardframe" scrolling="auto" class="iframe_main" name="main" src="main.htm" frameborder="0" marginheight="0" marginwidth="0" allowtransparency="yes" onload="setIframeHeight('boardframe');">
</iframe>

G__

06-29-2009, 11:47 PM

Hello again,

I think I figured it out for FireFox 3.0.xx.
I changed the value of 16 in the red line to 70. I'm guessing that is the extra line length added to the iFrame for FireFox? If I'm wrong, Please post the proper tweak to the code.

Thanks again.

//Non-IE
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1];

var FFextraHeight=parseFloat(getFFVersion)>=0.1? 16 : 0;

myHeight=frame.contentDocument.body.offsetHeight+FFextraHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
dth || document.documentElement.clientHeight ) ) {

cincinnatiboy4867

07-21-2009, 06:01 PM

I'm trying to change the height automatically with iframes as well and I can't seem to get any of the scripts to work on this page:

http://www. durkmusicbeats . com/beats.html

Does anybody know why?

demodav

07-29-2009, 06:09 PM

Here is a major find cheers!

http://geekswithblogs.net/rashid/archive/2007/01/13/103518.aspx

telmessos

07-09-2010, 10:54 AM

I tried this code. It doesn't work. The content of the iframe is coming from a different page. I include a form with the iframe. When the form submits I need the iframe section resized. But it doesn't. Is there a way to do that vwphilips?

<body onload="setIframeHeight('ifrm');" onresize="setIframeHeight('ifrm');">

sishab

08-26-2010, 04:50 PM

Great Code Sunil! Thanks! It even works perfectly in Chrome. Cheers, Sishab:thumbsup:

Hi everyone,

The below code might help you.
It works well in both Firefox and IE all versions.

Code:

function setIframeHeight(iframeName) {
var iframeEl = document.getElementById? document.getElementById(iframeName): document.all? document.all[iframeName]: null;
if (iframeEl) {
iframeEl.style.height = "auto";
// need to add to height to be sure it will all show
var h = alertSize(iframeName);
iframeEl.style.height =h + "px";
}
}

function alertSize(frameId) {
var myHeight = 0;
frame = document.getElementById(frameId);
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1];
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 16 : 0;
myHeight=frame.contentDocument.body.offsetHeight+FFextraHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'

innerDoc = (frame.contentDocument) ? frame.contentDocument : frame.contentWindow.document;
myHeight= innerDoc.body.scrollHeight + 10;
//myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myHeight = document.body.clientHeight;
}
//window.alert( 'Height = ' + myHeight );
return myHeight;
}

Iframe tag:

<iframe id="boardframe" scrolling="auto" name="boardiframe" width="600" frameborder="0" src="http://yourdomain.com/Comments.aspx?id=xxx" onload="setIframeHeight('boardframe');"></iframe>

Cheers
Sunil

belboz

09-23-2010, 08:36 PM

Hi...

Continuing on with the thread, I am having a problem with the resize...

I use the script below to adjust the size of the frame. It works nicely for me. The only problem is, the frame initially jumps to the bookmark, and then on the reload, jumps to the top of the page.

Any ideas on how to keep the frame at the bookmark in the web page, instead of jumping back up to the top????

Thanks much in advance....

:confused:

<script>

</script>

<IFRAME src="main.htm" frameborder="0" scrolling="no" ID=MainWindow NAME=MainWindow HEIGHT=800 WIDTH=1012 onLoad=resize_iframe();></IFRAME>

Arty Effem

09-24-2010, 01:00 AM

The only problem is, the frame initially jumps to the bookmark, and then on the reload, jumps to the top of the page.
What causes the iframe to jump on initial load of the parent page?

Do you mean on reload of the parent page of just the iframe?

belboz

09-24-2010, 02:51 AM

Thanks for taking the time...

The frame has an image in it, and it links to the next image in a sequence. The link references the same frame (_self), but a new page with a picture on it. The new page has a bookmark #pic so that the page is positioned so the person doesn't have to scroll. Sort of like a point and click slide show.

photo2.htm#pic

Is the referencing link.

When the page does not get reloaded because the frame is referenced from the external site, the page adjusts to the bookmark nicely. It is just that last reload.

I'm stuck with frames for many reasons. It is what I know, and by framing it, I eliminate the need to make duplicate web pages, which have quite a bit of information on it. The below the line information (framed info) can be used from many different sites, but appears to be a seamless entity.

Thanks again....

belboz

09-24-2010, 02:53 AM

I mean the reload of the parent page, not the frame. When the frame is initially loaded, everything is fine.

The step when it adjusts the size of the frame based on the height of the information - the purpose of the script.

Arty Effem

09-25-2010, 05:42 PM

It would be helpful to see this working, however there is an error in the code that may have something to do with the problem.

The statement if ( window.frames["MainWindow"].document.body.scrollHeight=0 ) is intended as a comparison, but is actually setting the height to 0 prior to setting the correct height.

Try reducing the code to this:<script type='text/javascript'>

document.getElementById("MainWindow").height=100
document.getElementById('MainWindow').height=window.frames["MainWindow"].document.body.scrollHeight + 20

</script>

Currently this is the code that I recommend for resizing iframes to their content. The example should have the same effect:
<script type='text/javascript'>

function sizeToMyContent( ifRef, setW, setH, fMargin )
{
var ifDoc, margin = typeof fMargin === 'number' ? fMargin : 16, h, w, sTop, sLeft;

try
{
ifDoc = ifRef.contentWindow.document.documentElement;
}
catch( e ){ ifDoc = null; }

if( ifDoc )
{
sLeft = document.body.scrollLeft + document.documentElement.scrollLeft;
sTop = document.body.scrollTop + document.documentElement.scrollTop;

if( setH )
{
h = ifDoc.scrollHeight;
ifRef.height = 1;
ifRef.height = h + margin;
}

if( setW )
{
w = ifDoc.scrollWidth;
ifRef.width = 1;
ifRef.width = w + margin;
}
}

window.scrollTo( sLeft, sTop );

}

</script>

<iframe src='myfile.htm' onload='sizeToMyContent(this, false, true, 20);' ></iframe>

belboz

09-25-2010, 10:00 PM

I'll give it a shot...

It is at www.ipoverty.com for now....

Just trying to put something together with limited knowledge, so thanks for pointing out the mistakes....

belboz

09-26-2010, 02:54 AM

lencoo12

09-26-2010, 04:24 AM

Hello,

i use AnthonyB script but it doesn't work in Mozilla Firefox 1.5.0.6, when i use function document.getElementById, I receive [null] object, i test it in Explorer 7 and Opera and there it works correctly.

Can anyone help me?
are you sure you have assigned an ID, not just a 'name' attribute.

They are different but IE is IE

___________________
watch movies online (http://moviesonlinefree.biz)

Arty Effem

09-26-2010, 05:00 PM

Gave it a shot at www.ipoverty.com

But it just blew past the bookmark when clicking on the images....

I see you put some thought into it, so I appreciate it. Unless something obvious stands out, I'll just live with it as it is. Thought it might be something simple....

Cheers....I have amended the code I gave in post #36. I noticed a problem and also revised it to restore the parent's scrolled position. It's still called in the same way.

belboz

09-26-2010, 06:14 PM

It works perfectly. I would not have been able to figure it out by myself.

I appreciate the efforts and hope the good karma is returned to you some day......

Thanks again....

Arnold

belboz

09-27-2010, 03:20 AM

I just noticed that the frame size does not contract if it is smaller. That was shy I threw in the If statement above....

I'll try and throw it back in...

Arty Effem

09-27-2010, 10:54 AM

I just noticed that the frame size does not contract if it is smaller. That was shy I threw in the If statement above....

I'll try and throw it back in...

I noticed that in I.E. and Safari. You need a strict doctype at the top of all involved documents:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

There still seems to be an inconsistency when setting width and height together, but I'll look into that.

belboz

09-27-2010, 12:23 PM

It works like a charm. Tripple checked...

If you are ever in Ann Arbor, MI - drop me a note and I'll buy dinner...

Thanks,

microman

08-28-2011, 01:22 PM

I just noticed that the frame size does not contract if it is smaller. That was shy I threw in the If statement above....

I'll try and throw it back in...

hi,
sorry to revisit topic, i have tried the code and it partially works for me. however like belboz i have a problem where the frame size does not contract if it is smaller. i have virtual zero experience in javascript so need help. the code i am using is below, can somebody please tell me what to add to it so if the linked frame size is smaller the frame automatically contracts as it only goes bigger at the moment.

Coded used:

<html>
<script type="text/javascript">
function autoIframe(frameId){
try{
frame = document.getElementById(frameId);
innerDoc = (frame.contentDocument) ? frame.contentDocument : frame.contentWindow.document;
objToResize = (frame.style) ? frame.style : frame;
objToResize.height = innerDoc.body.scrollHeight + 15;
}
catch(err){
window.status = err.message;
}
}
</script>

<body>

<iframe id="tree" name="tree" src="myitems.htm" onload="if (window.parent && window.parent.autoIframe) {window.parent.autoIframe('tree');}"
width="860" frameborder="0" >

</iframe>

</body>

</html>

thanks in advance.

dotnetmind

08-28-2011, 03:26 PM

microman

08-29-2011, 11:38 AM

Have you tried the following Function?

function resizeIframe(obj) {
obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
obj.style.width = obj.contentWindow.document.body.scrollWidth + 'px';
}

Hi,
i haven't tried that. how would i implement the code you have provided with my code (what would be my complete code after your bit is added). Also would this code automatically resize my iframe width as that is what i am after also?

Thanks again in advance.

jackderips

09-23-2011, 04:44 PM

My site had the exact same problem but I solved it with a simple script that I added.
THIS IS MY SITE (http://www.linkpremiumgenerator.com)

Scroll down to line 52 and simply copy the code to your own site.

hanpedro

07-18-2012, 12:38 AM

jackderips/

I visited your site -http://www.linkpremiumgenerator.com/-, but I could not find any script for iframe at 52 lines.

And I copied the link I want to include iframe, and press "generate" button, but your site shows "ERROR: [http://test.org/control/test_in.php] Invalid link format", However the the link I wrote is works at browser.

Would you please let me know how I can see the code you want to share.

stiglitd

03-26-2013, 05:07 PM

Anthony, I'm looking for code to resize an iframe. I have tried several things online. It looks like in this line of questions and comments with the code you said works, that I need to name my iframe, as in the last line of the code?

Do I then also add that name to all the areas in the code that calls for it?

I notice this is an older post, so any help or direction you can give me I would greatly appreciate....I will keep trying and hope eventually I get somewhere!