I'm currently experimenting with creating a small game using three.js. Below is the JavaScript code responsible for controlling the game:
window.onmouseover = function (ev) {
down = true;
sx = ev.clientX;
sy = ev.clientY;
};
window.onmouseout = function () {
down = false;
};
window.onmousemove = function (ev) {
if (down) {
var dx = ev.clientX - sx;
var dy = ev.clientY - sy;
camera.rotation.y += -dx / 100;
//camera.rotation.x += -dy/100;
sx += dx;
sy += dy;
}
}
My main query is: How can I prevent the mouse from moving beyond the window's boundaries and allow it to continue its movement seamlessly?
An initial thought I had was to consistently reposition the mouse at the center of the window in each frame, but implementing this solution proves challenging. Any guidance on how to achieve this would be greatly appreciated.