title: Three.js - Object follows mouse position
body: <p>I am creating a sphere in <code>Three.js</code> which has to follow the mouse whenever it moves, as displayed in <a href="https://stemkoski.github.io/Three.js/Mouse-Sprite.html" rel="noreferrer">this example</a>. The function that handles the mouse movement is the following:</p>
  
  <pre><code>function onMouseMove(event) {
  
      // Update the mouse variable
      event.preventDefault();
      mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
      mouse.y = - (event.clientY / window.innerHeight) * 2 + 1;
  
      // Make the sphere follow the mouse
      mouseMesh.position.set(event.clientX, event.clientY, 0);
  };
  </code></pre>
  
  <p>I attach a <strong><a href="https://jsfiddle.net/atwfxdpd/" rel="noreferrer">JSFiddle</a></strong> with the complete code inside it, where you can see that according to the DOM, <code>mouseMesh</code> is undefined. Do you have an idea of what am I doing wrong?</p>
  
  <p>Thanks in advance for your replies!</p>