问题描述
是否可以将指针事件设置为仅对触摸板上的滚动或拖动做出反应?我有一个 div 'in the way' 用于滚动复杂的 html 排列*,我想知道是否可以将指针事件限制为仅对滚动/鼠标滚轮动作做出反应.
我很想知道我是否正确理解了这一点.如果 pointer-events:none;
意味着所有事件都是无效的,我如何杀死所有事件但保留一个活动?
我设置的 HTML 区域比它适合的框大,但是如果我要显示滚动条,它看起来会比它应有的高,因为有一个弹出 (position:top) 元素.该区域仍然需要滚动,因此为了实现这一点,我使用 jQuery 使我的滚动框"跟随 div 中的一个不可见 div:
<div id="scrollcontrol"style="overflow-y:auto;overflow-x:hidden;position:absolute;顶部:12 像素;左侧:180 像素;宽度:40 像素;高度:1300 像素;"><div id="catscrollpos"style="position:absolute;顶部:0px;宽度:200px;高度:2250px;">
脚本
$('#scrollcontrol').scroll(function({$('#rangetable').css({'top':$('#catscrollpos').position().top+'px'});});
解决方案 至于 文档:
当一个元素应用了 pointer-events: none;
该元素从不任何鼠标事件的目标并且任何事件都是无效的;
请看这个演示:
http://jsbin/wewosumehi/1/
事件没有被触发,你甚至不能滚动container
.
Is it possible to set pointer-events to only react to scrolling or drag on a touch-pad? I have a div 'in the way' for scrolling a complex html arrangement* and I would like to know if I can limit the pointer events to only react to scroll / mouse wheel actions.
I am interested in knowing whether I understand this correctly. If pointer-events:none;
means that all events are void, how can I kill all events but leave one active?
I have set up an HTML area that is bigger than the box it fits in, but if I were to show the scroll bar, it would seem higher than it should be because of a pop-up (position:top) element. This area still needs to be scrolled so to achieve this I have used jQuery to make my 'box to scroll' follow an invisible div within a 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>
Script
$('#scrollcontrol').scroll(function({
$('#rangetable').css({
'top':$('#catscrollpos').position().top+'px'
});
});
解决方案
As for specification in the docs:
When an element has applied pointer-events: none;
The element is never the target of any mouse events and any events are void;
Please look at this demonstration:
http://jsbin/wewosumehi/1/
Events are not being fired, you cannot even scroll the container
.
这篇关于如何使用指针事件仅对滚动事件做出反应?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
更多推荐
[db:关键词]
发布评论