simplystuart / elm-scroll-to / ScrollTo


type Status

Represent the state of the scroll; the status will remain waiting until a scroll command is issued.

type alias Model =
    { scrollToStatus : ScrollTo.Status }}


type Msg

Track scroll messages.

type Msg
    = ScrollToMsg ScrollTo.Msg

Setup

init : Status

Setup a basic scroll command.

ScrollTo.init

update : Msg -> Status -> ( Status, Platform.Cmd.Cmd Msg )

Handle updates from the scroll animation.

ScrollTo.update scrollToMsg model.scrollToStatus

subscriptions : (Msg -> msg) -> Status -> Platform.Sub.Sub msg

Subscribe to scroll animation updates.

ScrollTo.subscriptions ScrollToMsg model.scrollToStatus

Run the Scroll Animation

toPosition : Position -> Status -> Platform.Cmd.Cmd Msg

Scroll to a position offset on the screen.

-- to the top!
ScrollTo.toPosition { x = 0, y = 0 } model.scrollToStatus

-- to x offset
ScrollTo.toPosition { x = 1080, y = 0 } model.scrollToStatus

-- to y offset
ScrollTo.toPosition { x = 0, y = 540 } model.scrollToStatus

-- to x,y offset
ScrollTo.toPosition { x = 1080, y = 540 } model.scrollToStatus

Animation Customizations

withDelay : Basics.Float -> Status -> Status

Add a delay (in ms) to your scroll command.

-- default: 0
ScrollTo.withDelay 1000

withDuration : Basics.Float -> Status -> Status

Add a duration (in ms) to your scroll command.

-- default: 1000
ScrollTo.withDuration 5000

withEasing : (Basics.Float -> Basics.Float) -> Status -> Status

Add an easing function (elm-community/easing-functions) to your scroll command.

-- default: identity (linear)
ScrollTo.withEasing Ease.inOutQuint