如果给出-1 z-index来创建box-shadow，如何使图像可点击？

Question

我的帖子包含使用Css3的带阴影的图像。为img标签创建-1的box shadow z-index。但问题是图像不可点击。由于href标签被赋予图像，如何创建我的图像可点击同时保留Box-shadow？

我的CSS：

.postimage {
width:100%;
height:250px;
margin:10px 0px 20px 0px;
z-index:12; box-shadow: inset 2px 2px 10px rgba(0,0,0,0.9);
}
.postimage img{
position:relative;
z-index:-1;
}

我的Html：

<div class="postimage">
    <a href="http://www.google.com"><img src="images/bg.jpeg" /></a>
</div>

不使用-1 z-index图像变为可点击，但css3框阴影不起作用。

Answer 1

$('.postimage').on('click', function() {
    var newURL = $('a', this).prop('href');
    window.location = newURL ;
});

Answer 2

将z-index:-1;更改为z-index:1;

Answer 3

您可以通过设置

使元素对鼠标事件透明（因此点击将通过）

pointer-events: none;