JSFiddle - React, Tailwind, and code Playground

HTML

<button class="zoomOff">±</button>
<button class="zoom_in">+</button>
<button class="zoom_out">—</button>

<div class="progress_table">
text
</div>

CSS

div {
  width: 100px;
  height: 100px;
  background: red;
  margin: 2px;
}

JavaScript

var currZoom = 1;

if (currZoom == 'normal') currZoom = 1; // For IE

$(".zoom_in").click(function () {
  currZoom *= 1.2;
  $(".progress_table").css('zoom', currZoom);
  $(".progress_table").css("transform", "scale(" + currZoom + ")");
  $(".progress_table").css("transform-origin", "0 0");
});

$(".zoomOff").click(function () {
  $(".progress_table").css('zoom', 1);
  $(".progress_table").css("transform", "scale(1)");
  $(".progress_table").css("transform-origin", "0 0");
});

$(".zoom_out").click(function () {
  currZoom *= .8;
  $(".progress_table").css("zoom", currZoom);
  $(".progress_table").css("transform", "scale(" + currZoom + ")");
  $(".progress_table").css("transform-origin", "0 0");
});