Back to top

Stable Version 3.0.1 (O11)
Also available for 10, 9.1, 9.0
Published on 6 Jan by 
Stable Version 3.0.1 (O11)
Also available for 10, 9.1, 9.0
Published on 6 Jan by 
Created on 25 February 2015

Back to top

Documentation

This "Back to top" link allows users to smoothly scroll back to the top of the page. It's a little detail which enhances navigation experience on website with long pages.

Element (default: "body,html")
Element that is affected by smooth scroll to top. You can choose tags, classes or ID's to specify the element that you want to be scroll-able.
Imagine if you have just ".MainContent" scroll-able, you will use ".MainContent" class to apply to this element.
E.g: (Tags)  - "body,html"
E.g: (Classes) - ".className"
E.g: (ID's) - "#elementeId"

ElementOffset (default: 300) Browser window scroll (in pixels) after which the "back to top" link is shown ElementOpacity (default: 1200) Browser window scroll (in pixels) after which the "back to top" link opacity is reduced ElementScrollTopDuration (default: 700) Duration of the top scrolling animation (in ms) IconName (default: Entities.IconName.arrow_circle_o_up) Back to top arrow icon IconSizeId (default: Entities.IconSize.Percent_33) Back to top icon size. IconColor (default: White) Back to top icon color. Color (default: Orange) Back to top background color. BorderRadius (default: 5px) Back to top border-radius. Bottom (default: 30px) Distance form the bottom. Right (default: 30px) Distance form the right.
Support Options
This component is not supported by OutSystems. You may use the discussion forums to leave suggestions or obtain best-effort support from the community, including from Miguel Vicente who created this component.
Dependencies
Back to top has no dependencies.