Questions tagged [pointer-events]

In HTML5: hardware-agnostic events from devices like a mouse, pen, or touchscreen. In CSS: a property specifying if a particular graphic element can become the target of mouse events.

Learn more about HTML5 pointer events:

Learn more about CSS pointer-events property:

238 questions
2
votes
1 answer

How to use onpointermove properly to draw in HTML5 Canvas

I'm using onpointerdown, onpointerup and onpointermove for handling HTML5 Canvas Freehand drawing and it works perfectly with mouse. However, when I use a mobile it doesn't work, I have to add ontouchmove as shown in my working example. How can I…
Chumpocomon
  • 661
  • 1
  • 6
  • 12
2
votes
2 answers

CSS pointer-events: none while allowing hover

I'm trying to create an element of top my page which can be hovered. When hovered I want to change the opacity of the element and allow click through. The thing is when I add the pointer-events: none to allow the click through, my hover is never…
toto1911
  • 481
  • 3
  • 21
2
votes
0 answers

Pointer Events Not Working on Ios React Native

I have map-view on the background and a bottom sheet above it with different icon and on swipe up i disable the map-view by making pointer-event value 'none'. Below is the code its working fine on android but map view not taking any event until i…
2
votes
0 answers

Ionic3/iOS: remove "pointer-events: none" does not re-enable scrolling

I have a simple ionic page contains a button that show a model. When the modal is opened the body scroll gets disabled using "pointer-events: none" in app root level. The issue is when I dismiss(cancel) the modal, "pointer-events: none" is removed…
DojaB
  • 61
  • 3
2
votes
0 answers

Sidestep iOS13 Native PointerEvents

iOS13 implements PointerEvents but has issues (https://caniuse.com/#feat=pointer). The polyfil I've been using for Safari (PEP / Pointer Events Polyfil) is standing down because it appears there is native support, causing things to break. I've…
Ian
  • 592
  • 5
  • 21
2
votes
0 answers

SVG pointer-events and stroke-dasharray

In the next example I'm drawing an ellipse with no fill and a stroke-dasharray. The pointer-events is set to visibleStroke or stroke. When I mouse over the stroke the circle inside should change it's fill and the stroke: ellipse:hover ~ circle { …
enxaneta
  • 31,608
  • 5
  • 29
  • 42
2
votes
0 answers

pointer-events: none not working in Safari v7 in iPads

I am trying to disable click on a two div elements until another div has loaded completely. Once its loaded I am removing the pointer-events: none to it. For this am adding a class which has as follows: .someclass { pointer-events: none }…
2
votes
2 answers

How to trigger mouse-click event on multiple HTML elements covering each other?

How to trigger multiple mouse-click events on arbitrarily many HTML elements covering each other? I know you can use pointer-events: none; to let your click pass through your elements, but what if I want to trigger the mouse-click event on an…
Magnus
  • 3,086
  • 2
  • 29
  • 51
2
votes
1 answer

Detect two finger touch with PointerEvents on the same target

I have big HTML element on the screen (canvas) and I want to detect multi-touch events. With "touchstart" you have "touches" property, but with PointerEvents I don't know any way to know if multi-touch occurred (besides checking if there's more than…
kutomer
  • 734
  • 8
  • 17
2
votes
0 answers

JavaScript + Canvas: Write/Draw with stylus, ignore hand

I want to develop a web app (using HTML5 components like and JavaScript libraries) that accepts user input from a stylus or a mouse but ignores touch input so you can safely rest your hand on the drawing canvas without it being interpreted…
Christian Vorhemus
  • 2,396
  • 1
  • 17
  • 29
2
votes
0 answers

Canvas Drawing with Surface Pen

I'm currently using this Code to draw in a canvas with a pen from a Microsoft Surface (on a surface, of course):