title: movement of image is not smooth while image is moving slow
body: <p>I was trying to move an image to the left continuously (with a time delay) but I am unable to get the smoothness effect. I am getting jerky effect. I am using requestAnimationFrame inside the setTimeout as below.</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;Moving Screen Saver&lt;/title&gt;
          &lt;style&gt;
              html, body {
                background-image: url("https://s14.postimg.cc/jei3ov2nl/moon_bg.png");
                  background-repeat: no-repeat;
              background-size: cover;
                  position: relative;
                  height: 100%;
                  width: 100%;
              }
  
              #poster {
                  background-image: url("https://s14.postimg.cc/582ctpzj5/gladiator.png");
                  position: absolute;
                  background-position:right 20px bottom 20px;
                  background-repeat: no-repeat;
                  width: 100%;
                  height: 100%;
                  z-index: 99999;
                  background-color: transparent;
              }
          &lt;/style&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div id="poster"&gt;&lt;/div&gt;
  
          &lt;script&gt;
              var poster = document.getElementById('poster');
              var animate;
  
              function moveLeft()
              {
                  poster.style.left = poster.style.left || 0;
                  poster.style.left = parseInt(poster.style.left) - 10 + 'px';
                  setTimeout(function() {
                          requestAnimationFrame(moveLeft);
                          }, 50);
                  //requestAnimationFrame(moveLeft);
              }
  
              moveLeft();
          &lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>If I change the interval to 10 in setTimeout() (or if I just use requestAnimationFrame instead of timeout), the movement is smooth but it is too fast and user can't see properly. Can anyone please let me know is there anyway to achieve the smooth effect with slow moving?</p>
  
  <p>Below is the jsfiddle link</p>
  
  <p><a href="https://jsfiddle.net/un45c6s3/7/" rel="nofollow noreferrer">https://jsfiddle.net/un45c6s3/7/</a></p>