Adding a scroll to bottom button to the form.

Goedemiddag! Ik heb een korte vraag. Ik wil graag een knop toevoegen aan het begin van de pagina dat ze meteen naar het aanmeldformulier onderaan de pagina gestuurd worden. Zodat ze niet de gehele pagina hoeven te lezen als dat niet nodig is. Is dat mogelijk?

Hi Kanters,

Thanks for reaching out to Jotform Support. Unfortunately, our Dutch Support agents are busy helping other Jotform users at the moment. I'll try to help you in English using Google Translate, but you can reply in whichever language you feel comfortable using. Or, if you'd rather have support in Dutch, let us know and we can have them do that. But, keep in mind that you'd have to wait until they're available again.

Now, let me help you with your question. Are you referring to a scroll-to-bottom button that will allow your users to scroll to the very bottom of a form with a click? Although that feature isn’t available yet, as a workaround, we can add a scroll to the bottom button by injecting CSS code. Let’s do it:

1. In Form Builder, go to the submit button.
2. Click on the Gear icon, and go to Advance.
3. Go to Field Details, and copy the Fields IDs.

1. Add a Paragraph element to your form from the Form Elements menu on the left. It doesn't matter where you put it, then click on Edit.

1. Copy the following code, then replace [YOUR-SUBMIT-ID] with the Field ID of the Submit button, in this form's case it's #input_2.

<p class="scroll-to-bottom"><a href="[YOUR-SUBMIT-ID]">Scroll<br />to<br />bottom<br />&darr;</a></p>

1. Open up the Source Code editor by clicking the appropriate button on the toolbar.
2. Paste the codes and click Ok.

1. Copy the codes below.
2. Click on the Wand icon to open the Form Designer.
3. Go to Styles, scroll down, and paste it into the Inject Custom CSS box.
4. Click Save.

.scroll-to-bottom{

 text-align:center;

 position:fixed;

 right:5%;

 bottom:5%;

 border:1px solid #333;

 padding:5px;

 border-radius:5px;

 line-height:18px;

 font-size:16px;

 cursor:pointer;

}

.scroll-to-bottom a{

 color: #333;

 text-decoration:none;

}

Here's the result:

Here's a link to the demo form that you can clone.

Give it a try and let us know how it goes.