2

I have to place the content of service provider in an iframe on parent website. The height of the iframe content would dynamically change depending on user interaction.

Problem I face is that there is some extra height added to the iframe. I'm not sure where the height is coming from.

Any insight appreciated.

LINK TO PAGE

dragonfly
  • 3,203
  • 7
  • 30
  • 52

3 Answers3

0

I don't believe this to be the fault of easyXDM.

It appears that the height being calculated is for the current width of the iframe. If you remove line 28 in your HTML file, you will see that the height is completely filled. (Or the following line) (Or you can leave the code as is, and disable the height style in your developer tools and see the result)

  this.container.getElementsByTagName("iframe")[0].style.width = "500px";

Since it's hard to modify the code in the debugger, the next thing I would try is, setting the width to what you would like it to be prior to filling with content and a calculated height.

Michael K.
  • 555
  • 2
  • 15
0

I had the same problem When you do assign the height to the iframe element, don't assign it to all iframe. Because it affects iframes in the Ads and social media plugins.

So I did the following

$('#divID iframe').height(easyXDMmessage);
$('#divID iframe').width('100%');
Nathan
  • 137
  • 3
  • 14
0

In the case of empty iframes, I ran into an issue where if you set the height to 0px, the parent block element will still show at least one line of empty text. This is because iframes are actually inline elements, so their parent block will still show one line-height of text even if the iframe itself is zero height. Here's the simple fix:

iframe#my_iframe { display:block; }
Garry Tan
  • 322
  • 3
  • 4