Почему этот код НЕ работает для всего тела и не работает гладко?
function func (u){
document.getElementsByClassName("x")[0].innerHTML= u.clientX;
document.getElementsByClassName("y")[0].innerHTML= u.clientY;
}
div{
float: left;
}
div:before{
content: "Mouse Position >> ";
}
.x:before{
content: "X: ";
}
.y:before{
content: "Y: ";
}
p,div{
display: inline;
}
body{
width: 100vw;
height: 100vw;
}
<body onmouseover="func(event)">
<div>
<p class="x"></p>
<p class="y"></p>
</div>
</body>