Scroll The Form Using a Custom Floating Button

This guide explains how to use a custom HTML floating button to scroll to the bottom of the form.

  1. Initial Setup:
  • Drag and drop an “HTML” field onto the very bottom of your form.
  • Rename the field as needed.
image
  1. Configuring The “HTML” Field:
  • Click the pencil icon of the “HTML” field.
  • Paste the code.
  • Save the changes.
image
  • Please use this code.
<style>
   .btn-float {
      position: fixed;
      bottom: 20px;
      right: 20px; 
      z-index: 1000;
    }
  </style>

  <!-- Floating button -->
  <a href="#scroll_to_bottom_of_page" class="btn btn-primary btn-float"><span class="glyphicon glyphicon-chevron-down"></span></a>

  <!-- Target anchor at the bottom of the page -->
  <div id="scroll_to_bottom_of_page"></div>
  1. Test Your Form:
  • Clicking the custom HTML floating button will scroll the form to the very bottom.
image

For any questions, please contact us - [email protected] or the Formyoula in-app chat. 🙂