ScrollSnap

Scrollable containers with snapping

This library is based on elm-css and accepts Html.Styled.Html items. If you are not using elm-css, use Html.Styled.fromUnstyled and Html.Styled.toUnstyled to convert the items and the resulting container.

Demo

horizontal :

{ itemWidth :

{ compatible

| value : String

, lengthOrMinMaxDimension : Compatible

, lengthOrAuto : Compatible

}

-> List (Html msg)

-> Html msg

Create a container with horizontal scrolling. The most visible item is centered horizontally.

div
    [ css
        [ border3 (px 1) solid (hex "eee")
        , width (px 500)
        ]
    ]
    [ ScrollSnap.horizontal
        { itemWidth = px 280 }
        [ item1, item2, item3, item4, item5 ]
    ]

README
About
2 versions
Source

Modules

ScrollSnap

cedricss/elm-scroll-snap/1.0.0

ScrollSnap

Modules