What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.
We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.
Iframe embed code have too much height on the website embedded JotFormAsked by Deralict on January 11, 2015 at 04:59 PMI spoke to soon. My code is rubbish (only works in desktop environment). So I'm going to do it the officially sanctioned way and use the code you supply.
Can you please retry re-embedding the jotform using its iframe embed code but without the 'script' part
Use the iframe code only
<iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotform.ca/form/43351436352248" frameborder="0" style="width:100%; height:5632px; border:none;" scrolling="no"></iframe>
then check again if the height issue still exist.
Please update us of the result.
OK, done, and it's live at www.lifesprung.com. Same result as before.
Please use the following iFrame embed code of your form and that should help:
<iframe id="JotFormIFrame" allowtransparency="true" src="//form.jotform.ca/form/43351436352248" frameborder="0" style="width:100%; height:2700px !important; max-height:2700px !important;border:none;" scrolling="yes"></iframe>
Hope this helps.
Do get back to us if you have any trouble.
Your new code has it's own problems...by making the height static, some of the content gets cropped when an "required field" error occurs (which forces the height to expand). In addition the "scrolling="yes" makes it difficult for the user as there are now two areas which can be scrolled independently.
Could I obtain a fix for the broken "auto height" script when using an iFrame please?
I checked your form using the default iFrame embed code:
<iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotform.ca/form/43351436352248" frameborder="0" style="width:100%; height:5184px; border:none;" scrolling="no"></iframe>
And it worked fairly well. There was only a small amount of extra space at the bottom. Removing the script actually caused the form to be extremely long. Using this code above, do you still get the same issue with the frame height?
Let us know and we will be happy to have another look.
Using the code above (which seems to be the same code provided within the JotForm app for iframe embeds) I have the same issue. The current page which uses this code is here: www.lifesprung.com.
Perhaps the problem is browser-specific? I can replicate with Chrome and Safari (Mac).
The iFrame does not have the full auto-height functionality, so you can:
1) Use it with the exact height, and optionally with scrolling 'yes' or 'auto'.
2) Use it with limited auto height option. This is enabled when you copy default iFrame code with the script part.
Alternatively to the iFrame, you can try the Embed code to see if it works better on your website. It comes with the auto-height functionality.
OK, I tried the "Embed" option code again (which wasn't working before). Now it seems to work fine...weird. So I'll keep monitoring it, and let you know if it stops working.
I'm not actually sure what you mean by "limited auto height option". It seems to suggest that either you use a "limited auto height option" or you hard-code the height, but there's no option to have the height set automatically and just simply work...?
Great! Please update this thread just in case.
My colleague is referring to the script in the iFrame codes which also controls the height of the form in iFrame.