CODEWITHSUNDEEP
javascriptiframeiframe-resizer
Dirty Bird Design
Dirty Bird Design

Reputation: 5533

iFrameResizer not calculating height of iframe

I have an external domain 'domainB' that I am pulling content from. Included in domainB's scripts is iframeResizer.contentWindow.min.js

My domain 'domainA' includes iframeResizer.min.js and I am calling it like: 

$('iframe').iFrameResize({log:true, checkOrigin:false,
heightCalculationMethod:"taggedElement"});

No matter what I change the 'heightCalculationMethod' to, it doesn't have any affect on the iframe's height. Below is the logging

[iFrameSizer][Host page: iFrameResizer0] Added missing iframe ID: iFrameResizer0 (http://domainB/) iframeResizer.min.js:8
[iFrameSizer][Host page: iFrameResizer0] IFrame scrolling disabled for iFrameResizer0 iframeResizer.min.js:8
[iFrameSizer][Host page: iFrameResizer0] [init] Sending msg to iframe[iFrameResizer0] (iFrameResizer0:8:false:true:32:true:true:null:taggedElement:null:null:0:false:parent:scroll) targetOrigin: * iframeResizer.min.js:8
[iFrameSizer][Host page: iFrameResizer0] [iFrame.onload] Sending msg to iframe[iFrameResizer0] (iFrameResizer0:8:false:true:32:true:true:null:taggedElement:null:null:0:false:parent:scroll) targetOrigin: *

So it appears it is working, there are no errors, but it is having no effect. Is there a better way to do this, one that would actually change the height of the iframe?

Upvotes: 1

Views: 6998

Answers (3)

Gregorio
Gregorio

Reputation: 428

I had the same issue. In my case this was because in the page within the frame (the page with iframeResizer.contentWindow.min.js) there is an external plugin which sets this CSS style:

body,html{height:100%}

I fixed it by adding this CSS in the page within the frame:

 body, html {height:inherit !important;}

Upvotes: 5

sweatherall
sweatherall

Reputation: 71

I was having the exact same issue as you (same settings and all), and realized that I did not have iframeResizer.contentWindow.min.js included correctly on my 'domaindB'

Once I made sure it was included, it worked - and a much longer list of logs was being printed.

Like you, I was under the assumption that because the initial short list of logs (that you quoted) were being printed, the two pages were communicating; however, this is not true.

If you have sourceMaps enabled, you should see logs coming from iframeResizer.contentWindow.min.js

like this:

iframeResizer.contentWindow.js:150[iFrameSizer][iFrameResizer0] Initialising iFrame (http://domainB.site) iframeResizer.contentWindow.js:150[iFrameSizer][iFrameResizer0] TargetOrigin for parent set to: * iframeResizer.contentWindow.js:150[iFrameSizer][iFrameResizer0] height calculation method set to "taggedElement" etc etc.

Upvotes: 2

David Bradshaw
David Bradshaw

Reputation: 13077

If that is all you are seeing in the log, then the script isn't being loaded into domain B, or some other JS code on domain B is crashing and stopping this JS from running.

Upvotes: 1

Related Questions