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.
horizontal : { id : String, itemWidth : { compatible | value : String, lengthOrMinMaxDimension : Css.Compatible, lengthOrAuto : Css.Compatible } } -> List (Html.Styled.Html msg) -> Html.Styled.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 ]
]