<div id="con"></div>

body{
margin:0px;
width:100vw;
overflow:hidden;
}
#con div{
width:100px;
height:100px;
position:absolute;
opacity:1;
transform:scale(1);
background-image:url("http://pngimg.com/uploads/parachute/parachute_PNG19423.png");
background-size:cover;
}
#con{
width:100%;
height:100vh;
background-image:url("https://onthehill.life/wp-content/uploads/2019/01/background-background-image-blue-sky-1054218.jpg");
background-size:cover;
left:0px;
top:0px;
}
@keyframes vam{
to{transform:translateY(-300px) scale(0.2);opacity:0;}
}

window.addEventListener("click",function(g){
var el=document.createElement("div");
el.style.cssText="animation:vam 4s linear infinite";
var ho=document.getElementById("con");
var x=g.offsetX;
var y=g.offsetY;
el.style.left=x+"px";
el.style.top=y+"px";
ho.appendChild(el);

setTimeout(function(){
el.remove();
},4000);
});