JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<body>
<div id="x"></div>
</body>
CSS
body {
background: #fff;
height: 2000px;
margin: 0;
}
#x{
background: #FFFF00;
border-radius: 15px;
width: 400px;
height: 400px;
position: fixed;
top: 20px;
left: 20px;
}
JavaScript
var $x = $('#x'),
$body = $(document.body),
bodyHeight = $body.height();
$(window).scroll(function () {
$x.css({
'transform': 'rotate(' + ($body.scrollTop() / bodyHeight * 360) + 'deg)'
});
});