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.
How can I keep my form from "floating" on mobile devices?Asked by ariclairevip on July 21, 2015 at 01:11 PM
How do I keep my website form from "floating" on mobile device. It also stops scrolling at a certain point instead of allowing the user to scroll all the way to the submit button. The form is here: http://www.ariclairevip.com/#!lets-get-started/c1bop. The domain host is Wix.
Thank you for your help ..thanks for the BEST form builder online!!!
From what I understand you are having issues with getting your jotform to display properly on your wix website without it floating.
Have you tried adding it as suggested in our guide for Adding JotForms to Wix?
Also, since you are using a form for mobile purposes make sure you've enabled Mobile Response.
However, do be advised that sometimes the Mobile Responsiveness can be offset if the Website is using assigned containers so in those cases it's a good idea to check your Mobile Host and try enabling the Mobile Settings to fix the problem.
When I look at this on my iPhone this is what I noticed.
At first it appears okay, but it's notable that it's cut off on the right side and the mobile responsiveness should fix that problem in most cases but might require further adjustments with injected css.
It's also notable that when scrolling the form appears to float sort of which I believe might be what you are talking about maybe?
Thank you. Will look into it... Your response is appreciated!!!
Again, thank you. The best answer was to "lock" the forms into place on the Wix editor. This stopped the floating issue. I am still having the issue of making the entire form visible. Both forms scroll to a point and cut off. I went back into the editor and changed the HTML code to make the form longer. Doing this creates a scroll bar on the PC version of the website. What can I do to make the pages scroll down to the Submit button on the mobile site without creating a scroll button on the PC site? Thanks!
PS. I can see the entire form inside Wix Mobile editor for the "Let's Get Started" page. I can see a partial form on the "Request" page. However, I can see only partial forms on mobile devices.
I have tested form on my Samsung Galaxy S4 and I noticed the white space at the bottom of the form.
You should be able to remove white space by changing the height of iFrame code. Height is currently set to 4000 px. Try to change the height to 3800px.
<iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotform.us/form/51088330453148" frameborder="0" style="width: 100%; height: 3800px; border: none;" scrolling="no"></iframe>
Hope this will help. Let us know if you need further assistance.
Thank you! Part of my issue is when I change the the height on the iFrame to a lesser height I get a scroll bar on the PC site ...not preferable. My issue is that on the mobile both forms cut off prior to getting to the end. How to fix? Thanks! Cheryl
I again tried adjusting the height of the iFrame code to 3800px and it cuts of the form on the PC site AND the mobile site.
It seems like the element that wraps your form is too long and there is an element blocking it.
The main element that also holds the form is also larger.
It seems like you might need to stick on the 4000px so that it won't be cut on both PC and mobile.
The problem with Wix is that it's hard to style or reposition the elements manually. And they seem to embed the elements in multiple iFrames. Have you tried embedding using the default script code instead? See if that embed code works.
Let us know if that one works.
Thank you for your many efforts!!! I could find no resolution for the issues so I ended up inserting a url link on the form to redirect mobile users directly to the form online. Works perfectly!!!! Thanks!
In a behalf of my colleagues, you're welcome.
We are glad to hear that you found a solution for your issue.
Feel free to contact us if you have any other questions.