Incorrect pageX, pageY values
cjolif opened this issue · comments
If you run:
<html>
<head>
<script src="../../requirejs/require.js"></script>
<script>require({baseUrl: "../.."}, ["dojo/domReady!"], function(events) {
obj.addEventListener("touchmove", function (event) {
span.innerHTML = event.touches[0].pageX;
event.preventDefault();
});
});</script>
</head>
<body>
<div id="obj" style="width: 640px; height: 480px; background-color: lightseagreen">
HERE I AM
</div>
<span id="span" style="position: fixed; right: 0"></span>
</body>
</html>on an iPhone with the browser window being zoomed, you will see that pageX corresponds to the coordinate from the page top / left even if that top / left is not anymore visible due to zoom/offset.
If you run:
<html>
<head>
<script src="../../requirejs/require.js"></script>
<script>require({baseUrl: "../.."}, ["dpointer/events", "dojo/domReady!"], function(events) {
events.setTouchAction(obj, "none");
obj.addEventListener("pointermove", function (event) {
span.innerHTML = event.pageX;
event.preventDefault();
});
});</script>
</head>
<body>
<div id="obj" style="width: 640px; height: 480px; background-color: lightseagreen">
HERE I AM
</div>
<span id="span" style="position: fixed; right: 0"></span>
</body>
</html>under the same conditions you will noticed that pageX will be relative to the visible part of the screen (so probably these is more clientX than pageX).
Another side effect of this problem can be seen using the functional test page deliteful/tests/functional/StarRating.html: on iOS, if the page is scrolled, the stars do not respond anymore to move events.