css中取消鼠标事件pointer-events:none应用场景

鼠标放置在红圈位置，不能触发hover小手

上方的图片和按钮有一定的宽度，所以需要给上方的图片和按钮 取消鼠标事件

            

 上层的按钮也是有hover事件的，所以把整个先取消掉鼠标事件，pointer-events:none;再给那些需要hover事件的按钮添加pointer-events:auto;

.right-nav {
            
            pointer-events: none;

            position: fixed;
            top: 50%;
            right: 0;
            z-index: 3;
            margin-top: -240px;
            width: 254px;
            height: 494px;
            background: url(./img/right-nav-bg.png) no-repeat top left;
        }

.right-nav .right-list {

            pointer-events: auto;

            position: absolute;
            top: 160px;
            left: 85px;
            
   }

这样就可以触发下面图片的hover事件了