JSFiddle - React, Tailwind, and code Playground

by Alex

HTML

<!-- source: http://zanstra.com/base/picks/progress -->
<body>
  <div>
  </div>
</body>

CSS

div {
  height: 60px;
  width: 60px;
  line-height: 60px;
  
  text-align: center;
  font-family: monospace;
  
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -31px;
  margin-left: -31px;
}

JavaScript

$(document).ready(function(){
  
  var seq = [ '•', '••', '•••', '••••', '•••••' ];
  //var seq = [ '.', '..', '...', '....', '.....' ];
  //var seq = [ '⊕', '⊗' ];
  //var seq = [ '|', '\\', '–', '/' ];
  //var seq = [ '⨁', '⨂' ];      
  var now = 0;
  
  window.setInterval(function(){ $('div').html(seq[now++ % seq.length]);   }, 250);
  
});