JSFiddle - React, Tailwind, and code Playground

by lbstr

HTML

<div>
<span id="one"></span>
<span id="two"></span>
</div>

CSS

div { position: relative; background-color: gray; width: 300px; height: 300px; }
div span { position: absolute; background-color: blue; width: 15px; height: 15px; display: inline-block; border-radius: 13px; }
#one { left: 50px; top: 70px; }
#two { left: 200px; top: 150px; }

JavaScript

$(document).ready(function(e) {

$('div').each(function() {

    $(this).hover(function() {
        $(this).find('span').stop(true, false).animate({
            height: '25px',
            width: '25px',
            margin: '0'
        }, 200);
    }, function() {
        $(this).find('span').stop(true, false).animate({
            height: '15px',
            width: '15px',
            margin: '10px'
        }, 200);
    });
});

});