JSFiddle - React, Tailwind, and code Playground

HTML

<div id="c"></div>
<div id="nav"></div>

CSS

#c {position:fixed; top:0; left:0; background-color:green; width:50px; height:50px}
#c:hover {opacity:0.8}

#nav {position:absolute; bottom:20px; right:20px; background-color:red; width:50px; height:50px;left:447px;top:352px}

JavaScript

$('#nav').draggable();

$('#nav').data({
    'x': $("#nav").css('left'), 
    'y': $("#nav").css('top')});

$("#c").click(function () {
    console.log($("#nav").data('x'));
    $('#nav').animate({
        'left': parseInt($("#nav").data('x')) - 15,
        'top': parseInt($("#nav").data('y')) - 14}, {
            duration : 500});
});