是否可以将指针事件设置为仅对触摸板上的滚动或拖动做出反应?我有一个 div '挡住了'用于滚动复杂的 html 排列*,我想知道是否可以限制指针事件仅对滚动/鼠标滚轮操作做出反应。
我有兴趣知道我是否理解正确。如果
pointer-events:none;
意味着所有事件都无效,我怎样才能杀死所有事件但保留一个活动?
我已经设置了一个比它适合的框更大的 HTML 区域,但是如果我要显示滚动条,由于弹出(位置:顶部)元素,它看起来会比应有的位置更高。该区域仍然需要滚动,因此为了实现这一点,我使用 jQuery 使我的“滚动框”跟随 div 中的不可见 div:
<div id="scrollcontrol"style="overflow-y:auto;overflow-x:hidden;position:absolute;
top:12px;left:180px;width:40px;height:1300px;">
<div id="catscrollpos"style="position:absolute;
top:0px;width:200px;height:2250px;">
</div>
</div>
脚本
$('#scrollcontrol').scroll(function({
$('#rangetable').css({
'top':$('#catscrollpos').position().top+'px'
});
});
至于docs中的规范:
当元素已应用时
pointer-events: none;
该元素从不是任何鼠标事件的目标,任何事件都是无效的;
请看这个演示:
http://jsbin.com/wewosumehi/1/
事件没有被触发,您甚至无法滚动
container
。
今天我也遇到了同样的问题。我想禁用点击事件但允许滚动。
我的旧代码:
<div style="width: 100%; height: 540px; overflow: auto; pointer-events: none;">
<table></table>
</div>
由于指针事件,我无法滚动:无;因此,我向 div 元素添加了溢出,向表元素添加了指针事件。它解决了滚动问题。
解决方案:
<div style="width: 100%; height: 540px; overflow: auto">
<table style="pointer-events: none;"></table>
</div>