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.


  • Profile Image

    Height issue of iFrame embedded form

    Asked by nuflat on March 23, 2016 at 05:57 PM
    Thanks that worked. I have an issue though of not being able to see the next button at the bottom of the page when viewing on a mobile device.  I have to enlarge the iframe on the webpage larger than the from to be able to view it.
    height iframe
  • Profile Image
    JotForm Support

    Answered by Mike on March 23, 2016 at 06:07 PM

    The iFrame height should be automatically handled by a script that is following the iFrame code.

    If the auto-height script is not working right in your case, you can override the iFrame height value manually.

    Example:

    <iframe frameborder="0" id="JotFormIFrame" name="JotFormIFrame" onload="window.parent.scrollTo(0,0)" scrolling="no" src="https://form.jotform.com/60827035958969" style="width:100%; height:539px; border:none;"></iframe>

    changed to

    <iframe frameborder="0" id="JotFormIFrame" name="JotFormIFrame" onload="window.parent.scrollTo(0,0)" scrolling="no" src="https://form.jotform.com/60827035958969" style="width:100%; height:800px !important; border:none;"></iframe>

    Where we change the height from 539 to 800 pixels.

  • Profile Image

    Answered by nuflat on March 24, 2016 at 02:44 PM

    Made the change but it made no difference.  The height on the form in iframe is set at 2285px.  I added the !important and increased the size but it made no difference.

  • Profile Image

    Answered by Ben on March 24, 2016 at 03:54 PM

    I took a look at your website and it seemed to be OK for me, but if you are still having issues, please do try changing the code a bit.

    If I understood you correctly, you had the height at 2285px and it was still not showing the full height. In that case, do try using the following one instead:

    <iframe frameborder="0" id="JotFormIFrame" name="JotFormIFrame" onload="window.parent.scrollTo(0,0)" scrolling="no" src="https://form.jotform.com/60827035958969" style="width:100%; height:800px !important; border:none; min-height:2300px;"></iframe>

    This will keep the minimum height for you, no matter what the size of the screen is, so on desktop it would be too big. As such this is only temporary to find the one that is best for you.

    When you test out the form and find the value that is best for you we would help you with the CSS that you can add to your website page - before the iframe code - which would make it as big as needed, across devices.

  • Profile Image

    Answered by nuflat on March 24, 2016 at 04:06 PM

    I added the code and it did not change anything on the desktop or mobile.

     

    <iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotform.com/60407022646145" frameborder="0" style="width:100%;

          height:800px !important;border:none; min-height:2300px;" scrolling="no">

        </iframe>

  • Profile Image
    JotForm Support

    Answered by Mike on March 24, 2016 at 04:46 PM

    The issue is most likely related to the static height of the form placeholder on your website.

    Please try to increase the form placeholder element size.