Features

  • Choose which side of the page to place the button on
  • Choose animation styles for animating in and out
  • Choose trigger distance (distance scroll before showing button)
  • Set animation speed
  • Style with presets or custom colors
  • Set scroll to top speed

Example

The Scroll to Top example for this page is is the blue button located in the bottom right-hand corner of the page. Once you’ve scrolled down the page far enough, in this case 400 px, the button animate in. Upon clicking it you’re returned to the top of the page. Give it a try!


Using Scroll to Top

Style

Style
Choose from one of Foundry’s built-in color swatches for your Scroll to Top button or use the RapidWeaver color picker to set the background and arrow colors yourself.

Animation

Animate In & Animate Out
Set which animation styles you would like the stack to use when animating the Scroll to Top button onto and off of the page. You can set the In and Out animations independent of one another.

Scroll Up Speed
Decide how fast you’d like the the page to scroll to the top by setting the amount of time it will take, in milliseconds, for the page to scroll upwards.

Trigger Distance
Lets you dictate when the Scroll to Top button will appear by setting the distance down the page the visitor must scroll before it will animate in.

Placement

Alignment
Allows you to decide which side of the page you’d like to place the Scroll to Top button. The button always appears at the bottom of the page.

Sign up for The Forge newsletter

Stay up to date on future versions of Foundry, as well as important news, updates and more!

This site is built using Foundry for RapidWeaver

© 2006-2016 Elixir Graphics | Contact Us