Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Incorrect height calculate? #16

Closed
indapublic opened this issue Feb 18, 2014 · 18 comments
Closed

Incorrect height calculate? #16

indapublic opened this issue Feb 18, 2014 · 18 comments
Labels

Comments

@indapublic
Copy link

Hi! It's me again. I am integrated script (as you recommended), and script is working successfully. But I have problem with height calculating (it's very large iframe)
You can try

<iframe src="http://avia.make.travel" width="100%" scrolling="no"></iframe>
$('iframe').iFrameSizer({
contentWindowBodyMargin: 0,
doHeight: true,
doWidth: false,
interval: 32,
autoResize: true
});

After iframe loaded please click big blue button. Iframe will set height at 1776px around, but content is larger.

@davidjbradshaw
Copy link
Owner

Strange, looks like mutationObserver stops working after the page goes past a certain size, or it gets throttled if called too many times in quick succession. This would appear to be a browser limitation.

Try turning on enablePublicMethods and then have the content page call window.parentIFrame.size() whenever it finishes adding in extra content to manually force the iFrame to trigger a resize event.

The other option would be to not make so many insertions in to the page at such a quickfire rate. I expect the browser kills the script, because it thinks you've created an endless loop.

Let me know if that fixes it for you.

@davidjbradshaw
Copy link
Owner

Also what happens in a browers, such as IE8, that does not support mutation observer?

@davidjbradshaw
Copy link
Owner

Lastly you only need to do.

$('iframe').iFrameSizer({
    contentWindowBodyMargin: 0,
});

As the other options are default values.

@indapublic
Copy link
Author

Also what happens in a browers, such as IE8, that does not support mutation observer?

I'm sorry. I don't have Windows right now and cannot check it.

Lastly you only need to do.

Hm, it not helps.

@davidjbradshaw
Copy link
Owner

Did you try window.parentIFrame.size()?

@indapublic
Copy link
Author

Yeah, it can helps (and I did it successfully for another case three days ago), but extra height in this case is always dynamical

@davidjbradshaw
Copy link
Owner

Can you not call it after each change to the page?

@indapublic
Copy link
Author

I'm sorry, I don't understood

@davidjbradshaw
Copy link
Owner

Can you call window.parentIFrame.size() every time content gets added to the page?

@indapublic
Copy link
Author

No, I don't have this opportunity

@davidjbradshaw
Copy link
Owner

OK, I have another idea, but need to checking in a new version.

At the moment the interval test only runs if mutation observer is not available, going to add option to force it to always run.

@davidjbradshaw
Copy link
Owner

In the meantime you could try adding the following to your page.

setInterval(window.parentIFrame.size,33);

@davidjbradshaw
Copy link
Owner

OK try the new 1.4.1 version with these options.

$('iframe').iFrameSizer({
    contentWindowBodyMargin: 0,
    interval: -33
});

Note the negative value on the interval option.

@indapublic
Copy link
Author

I'm tried - no difference.
You can view result on http://make.travel/ru/thailand/avia

@davidjbradshaw
Copy link
Owner

Your iFrame has version 1.4.0 in it, try upgrading to v1.4.1 and then calling with.

$('iframe').iFrameSizer({
    contentWindowBodyMargin: 0,
    interval: -33
});

@indapublic
Copy link
Author

Why you decide it?

It have

<script type="text/javascript" src="http://make.travel/js/jquery/iframeResizer.contentWindow.min.js"></script>

and http://make.travel/js/jquery/iframeResizer.contentWindow.min.js output:

/*! iFrame Resizer (iframeSizer.contentWindow.min.js) - v1.4.1 - 2014-02-20

@davidjbradshaw
Copy link
Owner

Seems the old version was getting cached in my browser. I've looked at this a bit more and it seems the issue is that on your page document.body.offsetHeight stops updating for some reason. Both my code and jQuery use this to get the height.

If the page never reduces in size, then you could look at changing the iframe script to use scrollHeight instead, but this value never reduces in size. So is not suitable for the main codebase.

Hope that helps.

@davidjbradshaw
Copy link
Owner

I've added a new option called heightCalculationMethod which if set to 'scroll' should fix this for you.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants