Search code examples
javascriptiframeiframe-resizer

How do I specify (or limit) which iframe(s) iframe-resizer will act on?

I have a page that needs to load 2 iframes, and I'm using David Bradshaw's iframe-resizer code.

I control the content of the page loaded in one of them, so I have the iframeResizer.contentWindow.min.js loaded in there, and the iframe resizes perfectly.

The 2nd iframe however loads a page I don't control, so it won't resize (I get that). However, for some reason the scrollbar I add is suppressed when I load the iframe-resizer code, even with scrolling="yes" defined.

I have the iFrameResize({log:true}) code after the "controlled" iframe. The "uncontrolled" iframe is earlier on the page (and needs to be there).

When I swap the order, i.e., I move the "uncontrolled" iframe after the "controlled" iframe (and as such after the iFrameResize({log:true}) code), then I do see the scrollbar for that iframe.

So, my question is: how can I specify which iframe(s) the iframe-resizer code needs to act on?

Thanks!

P.

Solution

  • Set a class or ID on the iFrame you wish to control, then pass that to iframeResize. 

    iFrameResize({log:true},'#myIFrame');

    Or you could pass the iFrame directly. 

    var myIFrame = document.getElementById('myIFrame');
iFrameResize({log:true},myIFrame);