iframe appearance

  • Profile Image
    Larrywolterbeek
    Asked on February 12, 2013 at 05:31 AM

    Hi this is what my iframe looks like, notice the Submit (Verstuur) button. If i embed this it shows the button well, but in a iframe it does not. Any clues?

    To tje left is the embedded form, to the right the iframe.

    I read that using an iframe does not have as mucht trouble as a embedded one.

    Larry

  • Profile Image
    Larrywolterbeek
    Answered on February 12, 2013 at 05:33 AM

    By the way the height in the iframe is 465px, but still the button shows "chopped"

    larry

  • Profile Image
    EltonCris
    Answered on February 12, 2013 at 07:14 AM

    Hi Larry,

    Remove the script code that is included ony our iframe embed code. That should help. That code is only useful if you are using page breaks with your form.

    Example:

    <iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotformpro.com/form/30348886039968" frameborder="0" style="width:100%; height:467px; border:none;" scrolling="no"></iframe>

    <script type="text/javascript">window.handleIFrameMessage = function(e) {var args = e.data.split(":");var iframe = document.getElementById("JotFormIFrame");if (!iframe)return;switch (args[0]) {case "scrollIntoView":iframe.scrollIntoView();break;case "setHeight":iframe.style.height = args[1] + "px";break;}};if (window.addEventListener) {window.addEventListener("message", handleIFrameMessage, false);} else if (window.attachEvent) {window.attachEvent("onmessage", handleIFrameMessage);}</script>

    Just embed only the iframe code (highlighted in green), do not include the script code (highlighted in red). Your iframe height can also be adjusted from the iframe code, notice the height:467px; under style attribute. You can change 467px to something that would look beautiful on your website. :)

    Thanks!

  • Profile Image
    Larrywolterbeek
    Answered on February 12, 2013 at 07:31 AM

    Thanks for the advice. That did the job. I used an iframe because I am also having trouble with displaying it on my site in IE8/IE9. I am only talking about the recaptcha and am hoping that using an iframe will solve this problem. Just using the embedded way gave me much headaches.Could you test it for me in IE8/IE9. Because I am only using a mac.

    www.wolterbeek-creaties.nl/contact.html

    Thanks!

  • Profile Image
    EltonCris
    Answered on February 12, 2013 at 07:39 AM

    Sure!

    Here's how your form displays on my IE8. It seems to be working fine now. http://snag.gy/oACZY.jpg

    And here's how it shows on IE9 via browserstack which is working great as well. http://snag.gy/SrRaV.jpg

    Feel free to let us know if you need anything else. Thanks!

  • Profile Image
    Larrywolterbeek
    Answered on February 12, 2013 at 07:44 AM

    Thanks Elton! Looks great!

    Cheers,

    Larry