Devotion appear animation

by Alexander Terehov

HTML

<div id="block"></div>

CSS

#block {
  background-color: rgba(0, 0, 0, 0.75);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  
  opacity: 0;
  transform: scale(0.001);
  transition: transform 500ms, opacity 500ms;
}

#block.open {
  opacity: 1;
  transform: scale(1);
}

JavaScript

const d = document

d.addEventListener(
	'click',
  () => d.querySelector('#block').classList.toggle('open')
)