test/scene.html

<!doctype html>
<html lang="en">
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8">
	<title>Test: Scene</title>
	<style>
		.square{
			position: absolute;
			display: inline-block;
			top:0;
			left:0;
			width: auto;
			height: auto;
			vertical-align: text-bottom;
			background-color: #000;
			padding: 20px;
			margin-bottom: 5%;
		}
	</style>
</head>
<body>
<div id="square_1" class="square"></div><br>
<script type="text/javascript" src="../fat.js"></script>
<script>

	const scene_1 = Fat.create();
	const scene_2 = Fat.create();

	scene_1.animate("#square_1", {

		left: "50%"
	},{
		duration: 2000,
		callback: function(){

			scene_1.animate(this, {

				left:  0
			},{
				duration: 2000
			})
		}
	});

	scene_2.animate("#square_1", {

		top:  "25%"
	},{
		duration: 2000,
		callback: function(){

			scene_2.animate(this, {

				top: "50%"
			},{
				duration: 2000
			})
		}
	});

</script>
</body>
</html>