Open Bug 1377841 Opened 3 years ago Updated 3 months ago
Problem with click/hover detection on 3d transformed DIVs
User Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0 Build ID: 20170628075643 Steps to reproduce: Created cube (2 sides open) from 3d transformed DIVs. Added click handlers via JS and :hover specific CSS. Actual results: Click handlers did not work and :hover CSS was not applied for substantial parts of the transformed surfaces, particularly in the far corners of the fully visible surfaces (red/green) and beyond the near corners of the partially obstructed surfaces (blue/yellow). Expected results: While the engine is already doing a wonderful job on (partial) obstruction, it should also sucessfully evaluate the mouse position as being inside all of the visible part.
Component: Untriaged → Event Handling
Product: Firefox → Core
Olli, this feels more layout-y than DOM-y to me and mccr8 but we'd like your input. Thanks.
Hit testing is very layout-y indeed.
hi, we have same problem. https://jsfiddle.net/plnttr1003/56vokvyf/ 1. Main element with properties transform: perspective(2000px) rotateX(45deg) 2.Inner element with properties transform: translateX(258px) translateY(60px) rotateX(-45deg); transform-origin: 50% 50%; 3.Inner element has :hover CSS Actual results: In firefox :hover CSS does not applied for bottom part of inner element. In chrome and safari applied for all element.
Webcompat Priority: ? → revisit
See Also: → https://webcompat.com/issues/30822
You need to log in before you can comment on or make changes to this bug.