JSFiddle - React, Tailwind, and code Playground

by boctulus

HTML

<body>
<div id = "moverDiv"><br/></div>
</body>

CSS

body {background-color: #000;}	

   #moverDiv
   {
		width:350px;
		height:350px;
		background-image: url("http://oi54.tinypic.com/28k3pjo.jpg");
		border: red 2px;
		position:relative;
   }

JavaScript

// @author: Pablo Bozzolo
	
	function moveMeHor(elem,cant,smooth)
	{
		smooth = smooth || false;
		
		if (!smooth){
			elem.style.left = cant;
			return;	
		}	
	
		(function(){			
			
			i = 0;
			inter = setInterval(function()
			{	
				if (i==cant)
					clearInterval(inter);
				elem.style.left = i;
				i++;
				
			},1);
		})();	
		
	}

	div = document.getElementById('moverDiv');

	div.addEventListener (click,
	function()
	{			
		moveMeHor(div,500,true); 
	},false
	);