How to replace :target for ie8?

Question

JavaScript

Hello.
There is such a simple modal window

#foto {	
position: fixed;
top:0;
left:0;
right:0;
bottom:0;
background-color: rgba(0,0,0,0.5);
display:none;
z-index: 99999;
pointer-event:none;
}
#foto:target {display:block; pointer-event:auto;}
#foto  div {
  width: 320px;
  height: 350px;
  position:relative;
  margin:10% auto;
  padding: 10px;
  overflow: hidden;
}
#close1 {
  line-height:16px;
  position:absolute;
  right:0;
  top:0;
  width:36px;
  text-decoration:none;
  border:#ffffff 1px solid;
  background:#ffffff;	
}
#modal_player1 {
  width: 320px;
  height: 360px;
  border:none;
}

<a id="video_modal" href="#modal"> <img src="images/player.jpg"> </a>
 <div id="foto"> <!--photo modal window -->
    	<div id="content1">
        	<a href="#" id = "close1"> Close </a>
            
            <iframe src="images/SpheraCat.jpg"  id="modal_player1"> </iframe>
        </div><!-- photo modal window -->
    </div>

It doesn't work in ie8 because the browser doesn't understand :target. In the internet, they wrote they say to replace :target with another class, and using js to add it to the element. Made. But doesn't work.

.foto {
  display:inline-block; 
  pointer-event:auto;
  width: 320px;
  height: 350px;
  position:relative;
  margin:10% auto;
  padding: 10px;
  overflow: hidden;
}

document.getElementById("foto").className ="foto";
Tell me, pazyazya, how to remake this window under ie8?

Answer 1

Just use this plugin arcticlab.ru/arcticmodal