JSFiddle - React, Tailwind, and code Playground

by Vitaliy

HTML

<a target="" href="asdasdasd" id="your-link-id" ><i class="pixeden our-focus-widget-image" >click this link</i></a>
<!-- gallery -->
<div id="your-gallery-id">
  <img src="http://d39kbiy71leyho.cloudfront.net/wp-content/uploads/2016/05/09170020/cats-politics-TN.jpg" alt="">
</div>

CSS

#your-gallery-id{
  position:fixed;
  width:300px;
  height:200px;
  top:50%;
  margin-top:-100px;
  left:50%;
  margin-left:-150px;
  background:#4762ec;
  padding:10px;
  display:none;
}
#your-gallery-id img{
  display:block;
  max-width:100%;
  margin:auto;
}

JavaScript

var gallery = document.getElementById("your-gallery-id");
document.getElementById("your-link-id").addEventListener("click", function(e){
	e.preventDefault();
  if(gallery.style.display == "none" || gallery.style.display == ""){
  	gallery.style.display = "block";
  }
  else{
  	gallery.style.display = "none";
  }
});