Cannot read property 'offsetHeight' of null

Resolved Janica
(@janica)

10 years, 10 months ago

Hi,

first of all, congrats on this plugin, it is exactly what i was looking for, thank you.

I have a page with multiple iframes, that in a first instance are hidden (css display none). Those iframes are displayed one by one through js, through user intervention.

The error Cannot read property ‘offsetHeight’ of null shows up in a sort of loop mode when the page loads.

The iframes are correctly resized, but console throws that error on an irregular basis, in some refreshes the error shows 5 times, on others it can go until 128 times.

the website is still on localhost, so i can’t provide an url.

I wanted to ask you if you have any idea of why this is happening.

Any thought would be highly appreciated.

thank you very much,
Janica

https://ww.wp.xz.cn/plugins/auto-iframe/

Viewing 5 replies - 1 through 5 (of 5 total)

Plugin Author Greg Ross
(@gregross)

10 years, 10 months ago
My guess would be that since the iframe’s are hidden, the browser hasn’t actually created their properties yet so when Auto iFrame goes to read ‘offsetHeight’, it’s a null object.

Auto iFrame just assumes the iframe exists.

Try making the following change to the auto-iframe.js file:
```
function AutoiFrameAdjustiFrameHeight( id, fudge )
      {
      var frame = document.getElementById( id );

      if( frame == null ) { return; }

      var content = jQuery('.embed-wrap');
      var height = frame.contentDocument.body.offsetHeight + fudge;

      content.height( height );
      frame.height = height;
      }
```
Thread Starter Janica
(@janica)

10 years, 10 months ago
Hi Greg,

thank you for your fast reply.

I thought it could be something related to the fact of the element being hidden, but unfortunately the code you provided doesn’t correct the situation..

Still the same error on console. I’m sorry, but js isn’t a language in which i’m confortable but i’ve inserted a console.log in your function to see if the frame was being validated as null and it isn’t.
```
function AutoiFrameAdjustiFrameHeight( id, fudge )
      {
      var frame = document.getElementById( id );

      if( frame == null ) { console.log("try this"); }

      var content = jQuery('.embed-wrap');
      var height = frame.contentDocument.body.offsetHeight + fudge;

      content.height( height );
      frame.height = height;
           console.log("or this maybe");
      }
```
with the code above, the console jumps between the error “Cannot read property ‘offsetHeight’ of null” and the log “or this maybe” – see here
Plugin Author Greg Ross
(@gregross)

10 years, 10 months ago
It’s probably deeper in the object chain, try this:
```
function AutoiFrameAdjustiFrameHeight( id, fudge )
      {
      var frame = document.getElementById( id );

      if( frame == null ) { console.log("frame null"); }
      if( frame.contentDocument== null ) { console.log("contentDocument null"); }
      if( frame.contentDocument.body == null ) { console.log("body null"); }

      var content = jQuery('.embed-wrap');
      var height = frame.contentDocument.body.offsetHeight + fudge;

      content.height( height );
      frame.height = height;
      }
```
Thread Starter Janica
(@janica)

10 years, 10 months ago
Hi Greg!

just to say: you rock!

it was the contentDocument.body that was null.

I’ve inserted the function return; as you stated in your first post and the page is now loading without errors and auto frame is (still) working like a charm.
```
function AutoiFrameAdjustiFrameHeight( id, fudge )
      {
      var frame = document.getElementById( id );

      if( frame.contentDocument.body == null ) { return; }

      var content = jQuery('.embed-wrap');
      var height = frame.contentDocument.body.offsetHeight + fudge;

      content.height( height );
      frame.height = height;
      }
```
just pasting the final code, in case someone else has a similar problem.

thank you very much,
Janica

PS – i’ve checked your website trying to find a donation and wasn’t able to. If there is one and i’m blind, or if you implement one, please tell me so. I don’t believe on making other work for me free of charge =)
Plugin Author Greg Ross
(@gregross)

10 years, 10 months ago

Thanks, I’ll do a release later this week with the fix.

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Cannot read property 'offsetHeight' of null’ is closed to new replies.