Widget.ScrollingNav

The Scrolling Nav is a navigation bar thats updates while you scroll through the page. Clicking on a navigation button will scroll directly to that section.

Basics

type alias Model section =

{ labels : section -> String

, positions : IntDict String

, arrangement : List section

, scrollPos : Int

}

type Msg section

init :

{ labels : section -> String

, arrangement : List section

}

-> ( Model section, Cmd (Msg section) )

The intial state include the labels and the arrangement of the sections

update :

Msg section

-> Model section

-> ( Model section, Cmd (Msg section) )

subscriptions : Sub (Msg msg)

view : (section -> Element msg) -> Model section -> Element msg

viewSections :

{ label : String -> Element msg

, fromString : String -> Maybe section

, msgMapper : Msg section -> msg

, attributes : Bool -> List (Attribute msg)

}

-> Model section

-> { selected : Maybe section

, options : List section

, label : section -> Element msg

, onChange : section -> msg

, attributes : Bool -> List (Attribute msg)

}

Operations

jumpTo : section -> Model section -> Cmd (Msg msg)

scrolls the screen to the respective section

syncPositions : Model section -> Cmd (Msg section)

Orasund/elm-ui-widgets/1.0.0

Widget.ScrollingNav

Basics

Operations

Modules