CODEWITHSUNDEEP
javascriptreactjs
D.Kenny
D.Kenny

Reputation: 121

How to rotate an image with 45 degrees by using reactJs

I want to incrementally rotate an image by 45 degrees one time, when the button was clicked, by using reactJs. But I have no clue how to do that. Can anyone give me some tips?

Upvotes: 4

Views: 27705

Answers (2)

Moose
Moose

Reputation: 1317

Just use CSS animations with transform: rotate(45deg);

Add that rule to a new CSS class, then use an event listener in JavaScript on the button that adds the transform to the image.

Upvotes: 3

FSeidl
FSeidl

Reputation: 382

You can keep the current rotation in the state of your component. And add an onClick handler which increments this by 45 at the time. Then use this variable in your render. Here is a quick codepen of how it could be implemented: https://codepen.io/anon/pen/YZrrWM

Upvotes: 7

Related Questions