title: Uncaught TypeError: Cannot read property 'clientX' of undefined
body: <p>I'm working out a simple jJavascript animation and I use <code>clientX</code> to determine the the position of the animated object, but I get the error above. What am I doing wrong here?</p>
  <p>Here is JS code:</p>
  <pre><code>(function() {
      var pos = 0;
      var timer;
      var anim = {
          time: 100,
          obj: null,
          init: function () {
              anim.obj = document.querySelector('#ball');
              anim.obj.style.left = 0 + 'px';
              anim.cord();
              console.log(document.querySelector('.coordonnee').pageX);
  
          },
          cord: function (e) {
              if ( parseInt(anim.obj.style.left) &gt;= parseInt(document.body.offsetWidth - anim.obj.offsetWidth) ) {
                  anim.animBack();
              } else {
                  anim.obj.style.left = parseInt( anim.obj.style.left) + 1 + 'px';
                  timer = setTimeout(anim.cord, 0.5);
              }
              anim.myCord(anim.obj.event);
  
          },
          animBack: function() {
              if ( parseInt(anim.obj.style.left) &lt;= 0 ) {
                  anim.cord()
              } else {
                  anim.obj.style.left = parseInt( anim.obj.style.left) - 1 + 'px';
                  timer = setTimeout(anim.animBack, 0.5);
              }
          },
          myCord: function(e) {
              var mx = e.clientX;
              var y = e.clientY;
              console.log(anim.obj.mx);
          }
      }
  
      anim.init();
  })(window);
  </code></pre>
  <p>And the HTML code:</p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;JS animation&lt;/title&gt;
      &lt;style type=&quot;text/css&quot;&gt;
      #ball {
          width: 50px;
          height: 50px;
          background: #ff45ce;
          border-radius: 50%;
          -webkit-border-radius: 50%;
          position: relative;
          left: 0;
      }
      &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div id=&quot;ball&quot; &gt;&lt;/div&gt;
      &lt;script type=&quot;text/javascript&quot; src=&quot;js/animation.js&quot;&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>