[Edit]

JavaScript - rotate string (animation)

1 contributors

2 contributions

0 discussions

0 points

Created by:

a_horse

538

In this article, we would like to show you how to rotate string using JavaScript.

Practical example

Edit

In this example, we create an animation that rotates the text placed in my-element every 0.1s (100ms).

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
<body onload="startAnimation('my-element')">
  <script>
​
    function startAnimation(elementId) {
      var element = document.querySelector('#' + elementId);
      var text = element.innerText;
​
      setInterval(function() {
        text = text[text.length - 1] + text.substring(0, text.length - 1);
        element.innerText = text;
      }, 100);
    }
​
  </script>
  <div id="my-element">Example text...</div>
</body>
</html>