iFrame dynamic resize not working correctly

[hindu times]

Hi there,

Just working on this page - http://www.rjt-online.com/photos_titletest.php

In Opera, the dynamic resize of the iframe isn't working correctly. As you can see in the code, I have set a minimum height of 200px so the iFrame should always be a minimum height but if the content requires it will increase. It works fine in IE8, Safari, FF, Chrome but not in Opera. In Opera it just sets the height at 200px.

Any help would be appreciated.

Thanks!

[fxm]

This line of original code for (i=0; i<iframeids.length; i++){ is still on the test page.

My previously suggested change

for (var i=0; i<iframeids.length; i++){

should be made even if that alone doesn't fix the problem with dynamic resizing.

[hindu times]

Ooops yeah I missed that bit.

Changed it now, but still not resizing in Opera.

[fxm]

The basic problem appears to be that the original code

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;
    }

excludes Opera from the logic that computes the frame height using browser-specific properties.

The intent seems to have been to avoid having NS, FF or IE properties applied to Opera. Unfortunately no 'generic' case is set, so Opera doesn't compute any override to the default height.

Also FFextraHeight [whatever that may be] is apparently applied in all non-IE cases; it will take some research to determine whether that is yet another blunder.

[fxm]

the original code

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;
    }

OK, replacing those 7 lines of code with this

currentfr.style.display = "block" // still not clear why this is here
    if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) {
        currentfr.height = currentfr.contentDocument.body.offsetHeight;
        if (!window.opera) currentfr.height += FFextraHeight;
    }
    else if (currentfr.Document && currentfr.Document.body.scrollHeight) currentfr.height = currentfr.Document.body.scrollHeight; //ie5+ syntax

should tell us whether I'm on the right track.

I really hate posting code this ugly but I don't have time right now to examine every issue in the original code. In particular the FFextraHeight logic appears to be sloppy at best, and the presence of the [apparently redundant] .style setting still bugs me.

[hindu times]

Tried this.

It fixes Opera but breaks the other browsers. The other browsers now display a massive iframe height.

[fxm]

Tried this.

It fixes Opera but breaks the other browsers. The other browsers now display a massive iframe height.

LOL

I should be able to repair that :)

[hindu times]

Awesome. I'm so dense with this stuff like!

[fxm]

I should be able to repair that :)

As I step through my code I can see the .height being set correctly for all browsers.

However, there is a problem elsewhere in the script. On some logic paths my code is not called at all, and on others I can see the height change [to small] immediately after it is set but then [except in Opera] it reverts to huge (without going through my logic again).

Plus Firefox [and AFAICT only Firefox] throws an error in the iframe onload= event handler.

Sorry, but I won't have time to chase this down today.

[hindu times]

No problem. I'm working on other pages at the moment so just reply any time you get a chance. Thanks!

[fxm]

This statement if (!window.opera) currentfr.height += FFextraHeight; should be

if (!window.opera) currentfr.height += +FFextraHeight;

[hindu times]

Done, doesn't seem to have affected the height of the iFrame in the other browsers though.

[fxm]

if (!window.opera) currentfr.height += +FFextraHeight;

Well, let's give this one more shot :(

if (!window.opera) currentfr.height -= -FFextraHeight;

(note that both signs have been changed)

[hindu times]

Bingo. That seems to work good on all of my browsers. Thanks. If you get a second, give it a quick test on browsers I don't have.

Much appreciated!

[hindu times]

FXM, any idea why the resize would stop working when I copy the code all over to another page. I've renamed everything that I think needs renaming (urls etc), but I'm guessing I'm missing something...

Page is www.rjt-online.com/video.php

[fxm]

resize [not] working
www.rjt-online.com/video.php

Please start a new thread.
This is an entirely different problem.

[hindu times]

No problem.

Started a new thread here: http://www.daniweb.com/forums/thread299641.html