Thanks for pointing me in the right direction.
I thought requestAnimationFrame() was very efficient but it may be only necessary when something needs to run constantly so cheers for that
Before I leave the page I'm killing the events like this:
document.removeEventListener('mousemove', mouseMove, false);
cancelAnimationFrame(mouseMove);
And load the events back in this way
document.addEventListener('mousemove', mouseMove, false);
Is that the most efficient way to handle things you reckon?
Previously, I had xPos and yPos variables in another function but I've now moved them inside of mouseMove()
function mouseMove(e) {
xPos = e.clientX;
yPos = e.clientY;
cTween.invalidate();
dTween.invalidate();
cTween.vars.x = dTween.vars.x = xPos;
cTween.vars.y = dTween.vars.y = yPos;
cTween.restart();
dTween.restart();
}
Does that look right to you or should I keep those variables outside the function?
I implemented your suggestions and the mouse seems to flow nicely no matter how many pages you visit.