JSFiddle - React, Tailwind, and code Playground

HTML

<div id="odometerDiv" style="width:100%;"></div>

<div class="instructions">
  Click the button below to output the current value of the odometer:
</div>
<div id="value">

</div>
<button>
  current value
</button>

<button class="pause-resume">
  pasue/resume
</button>

CSS

#odometerDiv {
  height: 60px;
}

#value {
  width: 400px;
  height: 40px;
  margin: 20px 0;
  text-align: center;
  line-height: 40px;
  font-size: 20px;
  background: orangered;
}

button {
  width: 100px;
  height: 20px;
}

.pause-resume {
  width: 100px;
  height: 20px;
  background: teal;
}

JavaScript

function Odometer(parentDiv, opts) {
  if (!parentDiv) throw "ERROR: Odometer object must be past a document element.";

  this.digits = 6;
  this.tenths = 0;
  this.digitHeight = 40;
  this.digitPadding = 0;
  this.digitWidth = 30;
  this.bustedness = 2;
  this.fontStyle = "font-family: Courier New, Courier, monospace; font-weight: 900;";
  this.value = -1;

  for (var key in opts) {
    this[key] = opts[key];
  }

  var style = {
    digits: "position:absolute; height:" + this.digitHeight + "px; width:" + (this.digitWidth - (2 * this.digitPadding)) + "px; " +
      "padding:" + this.digitPadding + "px; font-size:" + (this.digitHeight - (2 * this.digitPadding)) + "px; " +
      "background:black; color:white; text-align:center; " + this.fontStyle,
    columns: "position:relative; float:left; overflow:hidden;" +
      "height:" + this.digitHeight + "px; width:" + this.digitWidth + "px;",
    highlight: "position:absolute; background:white; opacity:0.25; filter:alpha(opacity=25); width:100%; left:0px;",
    lowlight: "position:absolute; background:black; opacity:0.25; filter:alpha(opacity=25); width:100%; left:0px;",
    sidehighlight: "position:absolute; background:white; opacity:0.50; filter:alpha(opacity=50); height:100%; top:0px;",
    sidelowlight: "position:absolute; background:black; opacity:0.50; filter:alpha(opacity=50); height:100%; top:0px;"
  };

  var highlights = [
    "top:20%;   height:32%;" + style.highlight,
    "top:27.5%; height:16%;" + style.highlight,
    "top:32.5%; height:6%;" + style.highlight,
    "right:0%;  width:6%;" + style.sidelowlight,
    "left:0%;   width:4%;" + style.sidehighlight,
    "top:0%;    height:14%;" + style.lowlight,
    "bottom:0%; height:25%;" + style.lowlight,
    "bottom:0%; height:8%;" + style.lowlight
  ];

  this.setDigitValue = function(digit, val, frac) {
    var di = digitInfo[digit];
    var px = Math.floor(this.digitHeight * frac);
    px = px + di.offset;
    if (val != di.last_val) {
      var tmp =...