I cannot scroll when my cursor is over my embedded form

  • Hiifons
    Asked on April 15, 2014 at 4:21 AM

    Hi,

     

    I have set up a form here. Problem is that the scroll does not work when the cursor is on the form. When I take the cursor outside it works just fine. any solutions for this?

  • jonathan
    Replied on April 15, 2014 at 4:43 AM

    Hi,

    I was able to see this issue on the Firefox browser, but not on google Chrome.

    To make it work also on Firefox, please try re-embeding the form using the iframe embed code BUT exclude the script part of the code from the iframe code provided.

    Example, if this is your form's iframe code generated by JotForm

    <iframe id="JotFormIFrame" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://secure.jotformeu.com/form/23303727825352" frameborder="0" style="width:100%; height:1833px; 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>

     

    only use the iframe code (in yellow) and exclude the script code (in red)

    Re-embed the iframe to your website and then test again.

    Kindly inform us if issue persist.

    Thanks!

  • Hiifons
    Replied on April 15, 2014 at 5:08 AM

    Hi,

     

    Didn't work.

  • Ashwin JotForm Support
    Replied on April 15, 2014 at 7:42 AM

    Hello Hiifons,

    Have you resolved this problem already. I did check your form in chrome and firefox but I am unable to replicate the issue you are having. Please check the screenshot below:

    I cannot scroll when my cursor is over my embedded form Image 1 Screenshot 20

    I would suggest you to please check again and get back to us if the issue persists.

    Thank you!

  • Hiifons
    Replied on April 15, 2014 at 7:51 AM

    Hi,

     

    Sorry I have maybe described the problem a bit wrong. If I move the cursor to the form area I cannot use my mouse scroll function.

  • jonathan
    Replied on April 15, 2014 at 9:13 AM

    Hi,

    I thought I also encountered the issue earlier on Firefox, but it seems I was wrong. Because as I test now, I can scroll even with the cursor alredy inside the a field on the form.

    If you take a look at the screenshot provided by my colleague, the cursor is inside the form and he was able to scroll. I was also able to do the same using the mouse device scroll function.

    Please test again on your end.

    To better test it, just put the cursor inside any field in the form and then simply use the scroll mouse on the side of the form.

     

    Inform us if you need further assistance on this.

    Thanks!

  • Hiifons
    Replied on April 15, 2014 at 9:45 AM

    Hi,

     

    It works fine on the grey area of the form but when I hit the white area I cannot scroll down. Is there a way to make so that I could scroll on both areas?

  • TitusN
    Replied on April 15, 2014 at 11:41 AM

    Hello,

    If you look at the page's HTML opening tag style attribute, you will see that the overflow-y property is set to 'hidden'

    Illustration:

    I cannot scroll when my cursor is over my embedded form Image 1 Screenshot 30

    This is what is causing this behavior in firefox - cause it apparently works in other browsers. 

    Try changing it to 'scroll' and let us know if that helps.

    I cannot scroll when my cursor is over my embedded form Image 2 Screenshot 41