JSFiddle - React, Tailwind, and code Playground

by mynameiswilson

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.0.6/jquery.mousewheel.min.js"></script>
<div id="cube"></div>
<div id="stat"></div>

CSS

#cube {
    width: 100px;
    height: 100px;
    background: #0f0;
}

JavaScript

$(document).ready(function() {
    $('#cube').on("mousewheel",function(e,delta) {
        $('#stat').html( (delta>0)?"up":"down" );        
        $('#cube').stop().animate({
            width: ((delta>0)?"+":"-")+"=5",
            height: ((delta>0)?"+":"-")+"=5",
        });
        
    });
});