html - 如何为元素的特定部分启用或禁用指针事件？

Question

我想知道是否有可能不完全禁用元素的一半指针事件？例如像下面的图片..

也许可以使用另一个元素来覆盖我想禁用的那部分元素，但据我所知，这是不可能通过任何直接的方式，但我们可以用另一个 div 覆盖图像的那部分，然后它会成功的......

Answer 1

为此，我们应该将图像放入容器中，然后将其位置设置为固定，现在让我们检查一下

#container{
    position:fixed;
    width:150px;
    height:150px;
    left:0;
    top:0;
    z-index:5;
    overflow:hidden;
}
#container img{
width:100%;
height:100%;
cursor:pointer;
}
#imgcover{
    position:absolute;
    display:inline-block;
    height:250px;
    width:150px;
    left:50px;
    top:8px;
    transform:rotate(45deg)
}

和html代码

   <div id="container">
        <div id="imgcover"></div>
        <a href="/"><img src="/forum_corner03.png" /></a>
    </div>