JSFiddle - React, Tailwind, and code Playground

by zlojnaxa

HTML

<div id="mainBlock"></div>

CSS

html, body{margin: 0px;background-color: #d8d8d8;width:  100%;/* height:  100%; */}

#mainBlock{
	width: 50px;
  height: 50px;
  background: grey;
  position: relative;
  top: 0px;
	transition: 0.5s;
}

JavaScript

var mainBlock = document.getElementById('mainBlock'), curPos=0;

mainBlock.style.top = '0px';

mainBlock.addEventListener ('click', function(){
   curPos = parseInt(mainBlock.style.top)+100;
   mainBlock.style.top=curPos+'px';
});