Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,11 @@ See some examples here: https://elm-simple-animation-examples.surge.sh/
Animate HTML, SVG (or any UI Elements) with declarative animations

```elm
import Html exposing (Html)
import Simple.Animated as Animated
import Simple.Animation as Animation exposing (Animation)
import Simple.Animation.Property as P

animatedDot : Html msg
animatedDot =
Animated.div expandFade [ class "dot" ] []
Expand Down
5 changes: 5 additions & 0 deletions src/Simple/Animated.elm
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,11 @@ import Internal.Animation as Animation exposing (Animation)

### Render an Animated `div`

import Html exposing (Html)
import Simple.Animated as Animated
import Simple.Animation as Animation exposing (Animation)
import Simple.Animation.Property as P

dot : Html msg
dot =
Animated.div expandFade [ class "dot" ] []
Expand Down
9 changes: 9 additions & 0 deletions src/Simple/Animation.elm
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,9 @@ type Step

{-| Create an animation with `start` and `end` properties:

import Simple.Animation as Animation exposing (Animation)
import Simple.Animation.Property as P

fadeOut : Animation
fadeOut =
Animation.fromTo
Expand Down Expand Up @@ -122,6 +125,9 @@ fromTo o from_ to_ =

{-| Create an animation with multiple steps:

import Simple.Animation as Animation exposing (Animation)
import Simple.Animation.Property as P

backAndForth : Animation
backAndForth =
Animation.steps
Expand Down Expand Up @@ -182,6 +188,9 @@ wait =

This animation will `wait` for `1500` milliseconds before animating to the next step

import Simple.Animation as Animation exposing (Animation)
import Simple.Animation.Property as P

finishAfterFadeOut : Animation
finishAfterFadeOut =
Animation.steps
Expand Down