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
0
votes
0 answers

How can I achieve pointerEvent all do not affect raycaster in react-three-fiber?

The raycaster work fine when make pointerEvent to none, but I need listen to some event like click on html tag that I change its pointerEvnet to all Then the coordinates of boxGeometry following mouse will be misaligned if using pointerEvent all my…
Roy
  • 731
  • 3
  • 10
  • 24
0
votes
0 answers

Pointer-events : Enable and Disable selectively. CSS

In following Next.js Component i want to add hover effects to the .itemCard and the button only. Those two must have diffent hover effects. (ex- itemcard will have a box-shadow effect and the button will have a backgroud color change). I have tried…
Ramesh Madara
  • 11
  • 1
  • 5
0
votes
0 answers

How to make a display:none block box belong to it's parent box when it change to display:block

Today I found a problem and it's about how to keep my delomorphous child box in the parent box. The keep means when I hover on the delomorphous box ,it won't disappear. I found that I can't keep the child box when I used position:absoluted with…
0
votes
5 answers

How to fix pointer event error ? React Native

I've been getting this error in mac M1 laptop , meanwhile it is fine with my other device I've been stuck here and cant fix these error , please help Also there is this error "Requiring module…
Jzx Naga
  • 61
  • 4
0
votes
0 answers

Is there a programm accessible relation between click-, mousedown- and pointerdown-events in Javascript?

Using pointer-events rather then mouse, touch or click events more often, I run into a situation where I would like to tell the browser, "hey, I am using pointer-events on this HTMLElement, forget about mouse, click or touch events (in particular…
Harald
  • 4,575
  • 5
  • 33
  • 72
0
votes
0 answers

svg tooltips aren't showing when pointer-events: none; is used

How do I fix this so that the tool tip is able to be seen? If I remove pointer-effects, then the video is not able to be clicked. How the code works is, you click on the play image and a video appears. Removing pointer effects will cause the video…
Eve Ninnall
  • 1
  • 3
  • 20
0
votes
0 answers

Adding content script will make pointer-events: none (chrome extension)

I'm developing a chrome extension for google docs, but once I add the content script in manifest.json, all the pop-up windows in google docs like 'sharing' and 'word counts' will have 'pointer-events:none' and go behind the…
0
votes
0 answers

Unity UI Toolkit: Custom Tool Tip on entering Element shows only the text not the whole UI

I have a problem with my Custom-"Item Tip". When I am with my mouse at the "start of the Tip, it's showing only text and not the whole UI. When I am only in the Inventory Item but not at the Tool Tip: When I am between being in it and not(I changed…
0
votes
1 answer

here map pointerenter not working with polyline grupe, but tap is working

I try to do arrow polyline (like here https://developer.here.com/documentation/maps/3.1.30.17/dev_guide/topics/routing.html -> Show route direction arrows). And I want to add to this routeLine pointerenter event, to make it hold and drag to add…
Eva
  • 188
  • 1
  • 4
  • 19
0
votes
1 answer

How can I detect an element underneath an image that I am dragging within a Pointer Event?

I have dynamically created a chess board using JavaScript with all the pieces in their starting squares. I have worked out how to get the pieces to move around on the board but cannot figure out how to detect the square(a paragraph element) under…
0
votes
0 answers

Pure CSS carousel behaves incorrectly if there is an overlapping element with pointer-events: none (Chrome and Android)

In my testing so far Chrome with mobile inspector or actual Android phone (my Pixel 6) both are experiencing incorrect dragging behavior if there is an overlapping element that has pointer-events: none on it. Amazingly it's working as expected in…
Clay Cooper
  • 101
  • 1
  • 5
0
votes
0 answers

How to handle PointerEvent for stylus and touch at the same time?

I tried to use Pointer Events to handle both stylus pen and finger touch simultaneously on touchscreen like phone, tablet. The use case is when drawing using pen, user can use finger for quick gestures. However, when pen is touched, and then finger…
Kay
  • 1
  • 1
0
votes
0 answers

pointer-events: none except for the click event

End Goal: I'm trying to manipulate an element inside an svg from a library I'm using. The element has drag and drop capabilities, but also shows a pop-up on click. I would like to disable the drag and drop but still allow the click. I know I can use…
0
votes
4 answers

How do you make an anchor link inside tag non-clickable or disabled?

I have an anchor link that was inbuilt with a tag, as I know we can disable/prevent click with different methods on the anchor tag. But my question arises can we prevent the click only for which is present inside the anchor tag.
Script Host
  • 911
  • 1
  • 11
  • 22
0
votes
2 answers

Receiving pointer events after a `contextmenu` event

It seems that when working with pointer events, a contextmenu event will lead to pointerout, pointercancel and pointerleave events, but subsequent pointerups and pointermoves will be ignored. This becomes quite a problem on touch devices where a…
Josh Hansen
  • 917
  • 1
  • 9
  • 20