Image Description: Microinteractions with ReactJS

twitter logo github logo ・1 min read

An experimental interaction for an image description.

When the "i" or information button is clicked, the description for the image will appear.

The "i" button is also animated, that when clicked, it will become an "x" or close button. There is also a short time of animation.

Animations are done just using the "property" component of CSS. The class toggles are done with ReactJS.

twitter logo DISCUSS (2)
markdown guide
 

This is a pretty cool stuff, Takane.

Would you have a plan to write how it works by chance?

 

Thank you.

Okay, I am going to edit compose words about the programming and coding stuff.

Classic DEV Post from Jul 17

My 2019 Remote Office Tour 🚀

Takane Ichinose profile image
A Front end developer who don't stop studying, and practising.

Sore eyes?

dev.to now has dark mode.

Go to the "misc" section of your settings and select night theme ❤️

(There is also a pink mode)