element.screenCorners broken?


When I start the project in desktop view the slider is positioned correctly inside the gray box, even when I then switch to a mobile view in Chrome’s developer tools. But when I reload the site in mobile view, element.screenCorners seems to return the wrong values and the slider is positioned wrongly.

This can also be reproduced on a real mobile device, where my slider was nowhere to be found.

Maybe I did something wrong, I’m not sure. The slider code is inside slider.js in scripts.

Image of wrong slider (blue line):

I believe it is due to having device pixel ratio enabled so the CSS styling has to take that into account. On desktop, it probably works because the pixel ratio is likely to be 1

I do something similar here for HTML UI input: User Interface - Text Input | Learn PlayCanvas

See updateStyle function in code https://playcanvas.com/editor/code/1005906?tabs=109842807

Thanks, disabling that did the trick.