Resize an iframe with Javascript

georgie

Member
Hello

I have to integrate a Fabrik form in an external website, on which I do not have the hand (a company CMS ... :confused:).
We must to use iframes...:mad:

My form Fabrik works very well, in connection with an extension emailing, controlled fields, responsive ... Great!
The company CMS will be unable to do that, only Fabrik. So I have to manage this.

Once integrated (we said "iframed", arf, I am going to become nuts!), my form still works on computer, but I have problem on mobile.

Here the page on extern website, my Fabrik form is in the center ("SUBSCRIBE TO OUR NEWSLETTER"):
https://www.euromedicom.com/en/contact/newsletter.html
Just resize like on mobile to see the problem at the footer of the form.

Somebody advices me a JS resize function, like this, to fix the problem on mobile:

JavaScript:
function iframeResize(event) {
"use strict";
if (event.data !== "resetComplete") {
return;
}
var body = document.body,
html = document.documentElement,
height = Math.max(body.offsetHeight, html.offsetHeight);
if (parent.postMessage) {
parent.postMessage(height, "*");
}
}
function resetParentHeight() {
"use strict";
if (parent.postMessage) {
parent.postMessage("resetIframe", "*");
}
}
window.addEventListener("load", resetParentHeight, false);
window.addEventListener("message", iframeResize, false);

I know the Fabrik method (a file as form_XX.js in components\com_fabrik\js), but I do not understand how and where trigger the resize function.

Please could you help me?
Maybe there is a easier way...

THX

Georges

#Fabrik
 
We are in need of some funding.
More details.

Thank you.

Members online

No members online now.
Back
Top