纯CSS代码实现点击弹出层效果加快网站打开速度

<a href="#open-modal">luck_zhichao</a>
<div id="open-modal" class="modal-window">
<div>
<a href="#" title="Close" class="modal-close"><i class="fa fa-times" aria-hidden="true"></i></a>
<img src="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png">
</div>
</div>

.modal-window {
	position: fixed;
	background-color: rgba(255,255,255,0.25);
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 999;
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	transition: all .3s
}
.modal-window:target {
	visibility: visible;
	opacity: 1;
	pointer-events: auto
}
.modal-window>div {
	width: 280px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	padding: 1em;
	background: #fff;
	border-radius: 10px
}
.modal-window header {
	font-weight: bold
}
.modal-window h1 {
	font-size: 150%;
	margin: 0 0 15px
}
.modal-close {
	line-height: 28px;
	position: absolute;
	right: -18px;
	text-align: center;
	top: -12px;
	text-decoration: none;
	display: block;
	background: black;
	border-radius: 100%;
	height: 30px;
	width: 30px;
	color: #fff
}
.modal-close:hover {
	color: #fff
}