Floating Bottom Div when Scrolling Down in Bricks

In the BricksLabs Facebook group, a user asked:

Any tutorial on how to implement the floating call to action element at the bottom this site? https://www.heyfriends.studio/

Initially thinking of headroomJS but open to suggestions.

I also have motion.page so if anyone has implemented something like this using that plugin, I'd appreciate your feedback.

This Pro tutorial provides the steps for setting up a bottom floater, which is initially off the screen on page load. When scrolling down, it slides up into view and remains; when scrolling up, it disappears (slides off the screen) and re-appears when scrolling down.

Step 1

Edit with Bricks the relevant Page/Template depending on where you want the floater to appear.

For sitewide, you could edit the Footer template.