title: Function to ease between two colors
body: <p>I'm looking to just have a simple div fade endlessly between two colors i.e. Blue to red, red to blue, blue to red, etc.</p>
  
  <p>Ideally I'd have a function like this that just takes two colors and the time it takes to fade between them.</p>
  
  <pre><code>toggle_color = function(color1, color2, time) { ... }
  </code></pre>
  
  <p>I've tried using setInterval and setTimeout to just flop between them, but it's not doing so smoothly (i.e. Fade) or in a loop. Not sure how to do that part. Also not sure that using a delay is the right road to go. Seems like it could be simpler to just be constantly in the state of fading between with a single time value, but again, not sure how.</p>
  
  <pre><code>function toggle_color(color1, color2, cycle_time, wait_time) {
  
  setInterval(function first_color() {
      document.body.style.backgroundColor = color1;
      setTimeout(change_color, wait_time);
  }, cycle_time);
  
  function change_color() {
      document.body.style.backgroundColor = color2;
  }
  </code></pre>