JSFiddle - React, Tailwind, and code Playground

by Twisty

HTML

<img src="http://lorempixel.com/400/200/" alt="" />

CSS

img {
  display: block;
  margin: 20px;
}

JavaScript

$(function() {
  var cDeg = 0;

  function animateRotate(elem, angle) {
    var $elem = $(elem);
    $elem.animate({
      deg: angle
    }, {
      duration: 2000,
      step: function(now) {
        $elem.css({
          transform: 'rotate(' + now + 'deg)'
        });
      }
    });
  }

  $("img").click(function() {
    cDeg += 45;
    if (cDeg >= 360) {
      cDeg = 0;
    }
    console.log(cDeg);
    animateRotate(this, cDeg);
  });
});