问题标签 [pointer-events]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
10 回答
20146 浏览

html - 仅使用 CSS 在悬停时显示下拉菜单并在单击时关闭

有人可以帮助我解释为什么当我单击下拉菜单中的链接时它们不起作用?也许是因为指针事件?我试图让一个下拉菜单在单击链接或单击关闭按钮后关闭。我添加了一些很酷的东西,比如单击链接时隐藏父容器。

这样做有很多选择:

  1. 使用:focus但当使用焦点时,下拉菜单不会在下一次悬停在下拉菜单上时触发。

  2. :active在容器上使用并pointer-events仅指向活动链接,但指针事件有问题

  3. using :targetbut 有与 :focus 相同的问题,不会触发第二个 hoover。

0 投票
2 回答
1695 浏览

javascript - preventdefault 和 stoppropagation 不适用于指针移动

我正在制作一个在 HTML5 内绘制的应用程序canvas,但我无法通过手机或平板电脑进行绘制。

下推时无法避免浏览器的原生滚动或 chrome 刷新

我在jsfiddle中创建了一个示例,因此您可以看到它。

0 投票
0 回答
2332 浏览

javascript - 如何在 Angular 中处理鼠标、触摸和指针事件?

现在是 2017 年,我发现在当今的浏览器中处理所有这些不同的输入方法(鼠标、触摸、指针)真的很痛苦。但是,在开发 HTML5/JS 跨浏览器/平台应用程序时,仅仅经常处理鼠标事件已不再适用。由于 AngularJS 是一个非常可靠、最先进的框架,我希望它在这件事上以某种方式支持我。还是我错了?

Chrome 55+ 现在支持Pointer Event API。对于尚不支持它的浏览器(或者不想支持它,是的,我指的是 Safari),有可用的polyfills。所以这看起来像是要走的路。

在我的 Angular 应用程序中,我只想执行以下操作:

然后我想忘记所有关于 ng-mouse* 处理程序的事情,而不关心编写我必须并行订阅的自定义 touchstart、touchend 等处理程序。

Angular 是否有计划为此添加本机支持?或者是否有任何 3rd 方 Angular 库以适当的方式支持这一点?

我知道我可以自己编写所有内容,但对我来说,这似乎是如此重要,以至于它应该得到框架或周围生态系统的期望关注。

0 投票
1 回答
359 浏览

javascript - 阻止嵌入式 SVG 在 Chrome 上捕获鼠标事件

很简单。我在我的文档中嵌入了一个 SVG,<object>并且我正在应用pointer-events:noneroot 的样式<svg>。它适用于 Firefox,但不适用于 Chrome(我目前对任何其他浏览器都不感兴趣)

MWE

有一个 HTML 文件

有一个 SVG 文件

如果没有办法让事件冒泡到锚点(即:停止 svg 捕获),那么通过事件视界传递事件的方法也很好

编辑

我忘了补充说该<object>元素必须保持可点击状态。我强调 MWE 在 Firefox 中有效,但在 Chrome 中无效

0 投票
0 回答
118 浏览

angular - 仅将 div 中的某些事件应用于滑动导航?

我正在尝试为我的移动网站实现滑动导航。我正在使用带有hammerjs的Angular 2来进行滑动事件。我正在尝试找出一个很好的解决方案来添加滑动事件。

尽管意识到我必须禁用许多指针事件,但我已经考虑过使用主体,而 div 位于主体堆栈的顶部。

所以相反,我在所有东西前面放置了一个定位的全屏 div,并希望在那里捕捉滑动事件。但是,这会阻止 div 下方的所有点击事件

删除所有事件(包括滑动)。

有没有办法让这个 div 只检测我的滑动事件,或者有更好的方法来实现这个?

0 投票
4 回答
1449 浏览

javascript - CSS:仅将指针事件应用于文本

有没有办法使用 CSS 指针事件仅应用于文本,例如在 div 中?这似乎适用于 SVG,但是否还有一个仅适用于常规文本元素的属性?

这就是我想要实现的目标:

我不想在父 div 中创建一个孩子来捕获事件。

提前致谢!

0 投票
1 回答
1024 浏览

javascript - 如何让指针事件在 iOS 中工作

我正在寻找一种在 WKWebview 下运行事件指针的方法。

更准确地说,例如能够在 iPad pro 下区分苹果铅笔的手指,能够在画布上书写。

否则,您知道库或在 WKWebview 中制作苹果工作铅笔的方法吗?

也许本机检测铅笔并通知javascript?

0 投票
1 回答
1245 浏览

javascript - PepJs/pointer-event polyfill not working on iOs safari

I'm trying to setup pointer events cross-browser. Now, most browser support it already, but safari on iOs doesn't. So I'm trying to polyfill this with pep-js without much success. Here is my test-code:

or an other one I've created on jsffidle

On the desktop it works like a charm, but safari on iOS it doesn't. Any suggestion what I'm doing wrong?

0 投票
1 回答
139 浏览

jquery - jquery ui手风琴的指针事件

我正在尝试使我的 Jquery Ui 手风琴以最初只能打开手风琴的第一个选项卡的方式工作。单击第一个手风琴选项卡时,第二个可打开(可单击),依此类推,一直到 7。

我已将pointer events手风琴选项卡 2-7 设置为none. 然后我尝试使用以下代码:

不幸的是,它不起作用,我不确定问题是什么。我正在处理的网页的链接可以在这里找到

预先感谢您的所有帮助:)

0 投票
1 回答
464 浏览

css - 仅检测覆盖 div 上的滑动事件

我正在尝试使用hammer.js 检测屏幕上的左右滑动事件。目前它检测到整个屏幕区域的滑动动作,因为我正在传递主要内容 div 类。我创建了一个覆盖一半屏幕区域的覆盖 div,并且在初始化锤子时传递了它的类。所以现在滑动工作正常了该区域,但所有其他指向覆盖下方内容的指针事件都被阻止。除了滑动事件之外,是否可以将所有其他指针事件传递给底层 div?