hide/disable <div> and <a> onlick of and image 但当它回到原始状态时恢复它们

hide/disable <div> and <a> onlick of and image but restore them when it backs to original status

请看实例:http://jsfiddle.net/greedylan/ftmg4kbs/

有没有办法在点击缩略图后关闭div.mask<p>resistor</p>?当它显示更大的图像时,我不需要遮罩和标题栏。但是我做的是在我们点击.closelink关闭放大图片的时候恢复。我试过如下使用 CSS 选择器,但它们不起作用。

.boxes li#one:target + div.mask {display:none}
.boxes li#one:target ~ a {display:none} 

.boxes li#one:target ~ p {display:none}

在这种情况下我们需要 javascript 吗? 提前致谢!!

/*changed*/
li:not(:target) .view:hover p {
    opacity: 1;
    transform: translateY(150px);
}

:not(selector) 选择器匹配每个不是指定的元素 element/selector。

/*added*/
li:target .view .mask {
    display:none;
}   

------> jsfiddle