JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ricostacruz.com/jquery.transit/jquery.transit.min.js"></script>
<div id="hi" style="margin-top:20px;margin-left:20px;width:10px;height:10px;background:black"/>

JavaScript

var $solarsys = $("#hi");
var hovered = false;
var lastHovered = 0;
$solarsys.hover(function(){hovered = true, lastHovered = new Date().getTime()},function(){hovered = false})
rotateImg();

var degrees = 0;
function hoveredIncrement(){
    timeToHalt = 2000;
    progress = timeToHalt - Math.min(timeToHalt, new Date().getTime() - lastHovered);
    increment = (progress / timeToHalt) * 5;
    return increment
}

function incrementDegrees(){
    if(!hovered){
        degrees = degrees + 5;
    }else{
        degrees = degrees + hoveredIncrement();
    }
    degrees = degrees % 360;    
}

function rotateImg(){
  incrementDegrees();
  $solarsys.transition({ rotate: degrees + 'deg'}, 100, 'linear', rotateImg);
};