Skip to content

Animating Visibility with CSS: An Example of React Hooks

Notifications You must be signed in to change notification settings

mb-wali/animated-visibility

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Animating Visibility with CSS: An Example of React Hooks

Please see the Medium post for the tutorial for building this component.

Tags

The tutorial is arranged as an incremental set of tags.

baseline
Starting point: no animation

animation-holes
First draft of animation; item not removed from DOM flow

animation-no-holes
Better animation, item completely disappears.

component-class
Refactored a reusable component, uses React class components

component-function
Refactored a reusable component, uses React functional components

multiple-animations
Reuse the animation component in a sidebar and navbar

final
Final component, refactored as function based HOC

About

Animating Visibility with CSS: An Example of React Hooks

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 73.7%
  • HTML 13.9%
  • CSS 12.4%