title: How to make a bar which scrolls the text horizontally like this one in the news?
body: <p>Hi I want to make a bar which scrolls the text like this one in the news. <a href="https://i.stack.imgur.com/H5IGV.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/H5IGV.png" alt="photo" /></a>
  I have a text which is too long for its maximal width and its overflow property is set to <code>overflow-x: auto;</code> so it's cutted. But I'm looking for such a bar which automatically scrolls my text (to the right) <strong>and when he finish, scrolls back in other direction (left).</strong> This is my text in css:</p>
  <pre><code>#text {
    display: block;
    color: white;
    position: absolute;
    width: 50%;
    left: 0%;
    text-align: center;
    font-size: 8vw;
    margin-top: 8.5%;
    font-variant: small-caps;
    text-shadow: 0 0 20px #000;
    text-align: center;
    z-index: 2;
    overflow-x: auto;
    white-space: nowrap;
    line-height: 100%;
  }
  </code></pre>
  <p>Any ideas? Actually answer can be in css, js or jquery. It doesn't matter.</p>