JSFiddle - React, Tailwind, and code Playground
HTML
<div id='outer'>
Current pointermove count: <span id='outerCount'>0</span>
<div id='inner'>
Current pointermove count: <span id='innerCount'>0</span>
</div>
</div>
CSS
#outer {
background-color: lightblue;
-ms-touch-action: none; /* auto */
}
#inner {
background-color: lightgreen;
height: 50px;
}
div {
padding-top: 100px;
padding-bottom: 50px;
}
JavaScript
var countOuter = 0;
$('outer').addEventListener('MSPointerMove', function(e) {
countOuter++;
$('outerCount').textContent = countOuter;
});
var countInner = 0;
$('inner').addEventListener('MSPointerMove', function(e) {
countInner++;
$('innerCount').textContent = countInner;
});