Elevator Scroll

Demo to preview the plugin:

Introduction

This Plugin allows you to add an “Elevator Scroll” effect to your app. When the action is triggered, the page slowly scrolls to the top of the page.
You can also specify an audio file that should be played during scrolling and an audio file that should be played once the top has been reached.
This is a fun Plugin that can help you to enhance the User Experience of your app and add a fun component.
Image without caption

How to setup

  1. Add the Element to the Page
      • Go to the Design tab in your Bubble editor.
      • Search for the element called Elevator Scroll.
      • Drag and drop it onto the page.
      Element → Elevator Scroll.
      Element → Elevator Scroll.
  1. Configure the Element Properties
    1. The Elevator Scroll element acts as a controller.
      (There are no configurable properties shown in the editor, so you can leave it as is.)
  1. Create a Workflow to Trigger the Scroll
    1. Now let’s use the plugin action to smoothly scroll to a specific vertical position:
      Element → Elevate.
      Element → Elevate.
      • Go to the Workflow tab.
      • Add a new event, such as “When Button is clicked”.
      • Add the plugin action:
        • Elevate
        • Fill in the fields:
          • Element: Select the ElevatorScroll element from the page.
          • Main Audio:
          • Static file: Upload a fixed audio file (e.g., elevator music .mp3).
          • Dynamic link: Provide a dynamic audio URL (e.g., from your database).
          • End Audio:
          • Static file: Upload an audio file to play after scrolling ends.
          • Dynamic link: Provide a dynamic URL for the end sound.

Plugin Element Properties

Elevator Scroll

Element properties → Elevator Scroll.
Element properties → Elevator Scroll.

Element Actions

  1. Elevate - Triggers a scrolling effect to the top of the page.
    1. Workflow action → Elevate.
      Workflow action → Elevate.
      Title
      Description
      Type
      Main Audio
      The audio file that should be played during the scroll.
      File
      End Audio
      The audio file that should be played once the scroll has been completed and the top of the page has been reached.
      File
Image without caption

Changelogs