JSFiddle - React, Tailwind, and code Playground

by zlojnaxa

HTML

<div id="image"></div>
<div id="button">Кнопка</div>

CSS

html, body{margin: 0px 0px 0px 0px;width:  100%; height:  100%; }

#image{
	width:100%;
	height:100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 0px 0px;
	position:absolute;
	display: none;
}

#button{
	width:  100px;
	height:  100px;
	background: #009688;
	cursor:  pointer;
}

JavaScript

document.getElementById('button').addEventListener('click',function(){
	let image = document.getElementById('image');
	image.style.display = 'block',
	image.style.zIndex = '1',
	image.style.backgroundImage = 'url(http://wall-pack.com/wp-content/uploads/2012/03/Car-Wallpapers-%E2%80%93-Part-17-9-500x500.jpg)';
},false);