Im trying to use a global variable called _mouseoverdistancebool
in my constructor to notice when the mouse is over an object 3D called distance
in threejs
. But the value never changes.
This is the code that affects the variable:
constructor(targetMesh, controls, camera, container) {
super();
this._mouseoverdistancebool = false;
this.addEventListeners();
}
addEventListeners() {
this._distance.addEventListener('mouseleave', this.mouseleavedistance);
this._distance.addEventListener('mouseenter', this.mouseenterdistance);
this._container.addEventListener('mousewheel', this.onMove);
this._container.addEventListener('DOMMouseScroll', this.onMove);
}
mouseenterdistance(evt) {
console.log("Mouse over the object!!!");
this._mouseoverdistancebool = true;
}
mouseleavedistance(evt) {
console.log("Mouse leaves the object....");
this._mouseoverdistancebool = false;
}
onMove(evt) {
console.log(this._mouseoverdistancebool);
}
So I can see in the debug that the events work well but the boolean is always false. Something like this:
>Mouse over the object!!!
>false
>Mouse leaves the object....
>false
Im new to constructors in javascript ... What Im doing wrong?