JSFiddle - React, Tailwind, and code Playground

HTML

<div id="box"></div>

CSS

#box {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100px;
    height: 100px;
    background-color: red;
}

JavaScript

function jump(oy, x, jh, jw, speed, id) {
	var ox = x;
	var inter = setInterval(function () {
	    y = oy - jh*Math.sin((x-ox)*Math.PI/jw);
	    if (x - ox >= jw) clearInterval(inter);

	    x+=3;

	    id.css({
	        'top': y + 'px',
	        'left': x + 'px'
	    });
	}, speed);
}

function move(id) {
	var id = $("#" + id);
	var p = id.position();
	jump(p.top, p.left, 100, 150, 30, id);
}

$("#box").click(function() {
    move('box');
});