Search code examples
iframe-resizer

Getting viewport dimensions with iframe-resizer

I have iframe-resizer working well, except I'm having trouble determining the viewport width/height from within the iframe content. I found I could call parentIFrame.getPageInfo(callback), but the object I get back looks like this:

{
  clientHeight: 6009,
  clientWidth: 1680,
  iframeHeight: 5968,
  iframeWidth: 1230,
  offsetLeft: 0, 
  offsetTop: 40,
  scrollLeft: 0,
  scrollTop: 580
}

I expected clientWidth and clientHeight to be the window viewport width/height. clientWidth looks correct, but clientHeight just looks like iframeHeight + offsetTop + 1px, whereas my browser window has a height of around 1000px. Am I misunderstanding what clientWidth/clientHeight mean or am I doing something wrong?

Solution

  • I found the problem was that the host page didn't have a DOCTYPE set at the top of its page. Once <!DOCTYPE html> was added to the top of the page, it worked!