z-index较高的元素滑轮

Question

当光标位于具有较高z-index的另一个元素上时，有什么办法可以在容器上启用鼠标滚轮吗？这里是例子：https://jsfiddle.net/dkdghj7r/。

$('div').on('mousewheel', function(event) { 
 
    event.preventDefault(); 
 
    console.log('Scroll!') 
 
})

div { 
 
    background: yellow; 
 
    height: 300px; 
 
    width: 500px; 
 
} 
 

 
span { 
 
    background-color: red; 
 
    display: block; 
 
    height: 100px; 
 
    left: 200px; 
 
    position: fixed; 
 
    top: 100px; 
 
    width: 100px; 
 
    z-index: 10; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div></div> 
 

 
<span></span>

Answer 1

如何计算由框中的网页上所占的面积，让鼠标的页面X/Y，并检查是否鼠标框的区域内：

$(document).on('wheel', function() { 
    var offset = $('div').offset(); 
    var width = $('div').width(); 
    var height = $('div').height(); 

    if (lastEvent.pageX > offset.left && lastEvent.pageX < offset.left + width 
     && lastEvent.pageY > offset.top && lastEvent.pageY < offset.top + height) { 
    console.log('Scolled inside yellow box!'); 
    } 
}); 

var lastEvent = { 
    pageX: -1, 
    pageY: -1 
}; 

$(document).on('mousemove', function(event) { 
    lastEvent = { 
    pageX: event.pageX, 
    pageY: event.pageY 
    }; 
}); 

https://jsfiddle.net/37d9z411/