Backtop
#

The backtop button is used to return to the top of a component.

Examples
#

Basic usage
#

By default va-backtop watches for a body element offset height. You can change a target element, positioning and scrolling speed.

Vertical Position:

Horizontal Position:

Vertical offset:
5%

Horizontal offset:
5%

Visibility height:
1

Scroll speed:
50

Open in GitHub

API
#

Props #

NameDescriptionTypesDefault
ariaLabel

String

"$t:backToTop"

color

String

""

horizontalOffset

String

"1rem"

horizontalPosition

String

"right"

preset

String

-

speed

Number

50

target

Object | String

-

verticalOffset

String

"1rem"

verticalPosition

String

"bottom"

visibilityHeight

Number

300

Events #

NameDescription

click

Emitted when user clicked on backtop. The event argument is:

Event

Slots #

NameDescription

default

Slot for backtop content

Css Variables #

NameDefault Value
--va-backtop-position fixed
--va-backtop-top auto
--va-backtop-left auto
--va-backtop-right auto
--va-backtop-bottom auto
--va-backtop-cursor pointer
--va-backtop-z-index 3