title: p5.js - get a rectangle to move left and right repeatedly (bounce)
body: <p>I'm trying out some sample code for a bigger project, and I'm having trouble getting my rectangle to bounce between two lines.</p>
  
  
  
  <pre class="lang-javascript prettyprint-override"><code>function draw() {
      print(frameCount)
      background(255)
      var x = 150 + frameCount;
      rect(x,200,15,15);
      line(150,0,150,400);
      line(250,0,250,400);
      if (x &gt;= 250) {
          background(255)
          x = 350-frameCount;
          rect(x,200,15,15);
          line(250,0,250,400);
          line(150,0,150,400);
      } if (x &lt;= 145) {
          background(255)
          x = 145 + (frameCount % 100);
          rect(x,200,15,15);
          line(250,0,250,400);
          line(150,0,150,400);
      }
  }
  </code></pre>
  
  <p>I'm getting the feeling that after the first instance, it's disregarding the original if statement, which dictates a bounce to the left. I'm really not sure what's going wrong, and any help would be appreciated.</p>