Skip to content

Commit 884c5e5

Browse files
committed
update readme
1 parent 00223e7 commit 884c5e5

File tree

1 file changed

+12
-5
lines changed

1 file changed

+12
-5
lines changed

README.md

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Animate CSS Grid
22

3-
Seamlessly animate all CSS grid properties, including:
3+
Performantly animate all CSS grid properties, including:
44

55
### `grid-column` and `grid-row`
66

@@ -22,11 +22,18 @@ Seamlessly animate all CSS grid properties, including:
2222
</a>
2323

2424

25-
- #### [Fork Photo Grid Example on CodeSandbox (uses ES2015 imports)](https://codesandbox.io/s/animate-css-grid-template-t6qsf)
26-
- #### [Fork Photo Grid Example on Codepen (uses script tags)](https://codepen.io/aholachek/pen/VXjOPB)
25+
- #### [Fork Photo Grid Example on CodeSandbox](https://codesandbox.io/s/animate-css-grid-template-t6qsf)
2726

28-
This script makes it easy to transition your CSS grid gracefully from one state to another.
29-
If the content of the grid changes, or if the grid or one of its children is updated with the addition or removal of a class, the grid will automatically transition to its new configuration.
27+
28+
### Why use animate-css-grid?
29+
30+
This library uses hardware accelerated transforms to transition between different layout states, which means, in comparison to pure CSS grid animations, it offers:
31+
32+
- better performance
33+
- more flexibility in terms of what properties can be animated
34+
- more configurable animations (easing options, staggers)
35+
36+
Want to have a look for yourself? Feel free to check out [this Mondrian animated with CSS keyframes](https://codepen.io/aholachek/pen/poOeXBM) and compare it with [the same UI animated with animate-css-grid.](https://codepen.io/aholachek/pen/XWPMwEx)
3037

3138
## How to use it
3239

0 commit comments

Comments
 (0)