JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://rawgit.com/mikaelhm/odometer/master/odometer.js"></script>
<div id="membercounterwrapper"> <span>MEMBERS #</span>
<span class="odom">0</span>
</div>
CSS
@font-face {
font-family:'Jura';
font-style: normal;
font-weight: 400;
src: local('Jura Regular'), local('Jura-Regular'), url(https://fonts.gstatic.com/s/jura/v7/x6RZE5IaGzhqlvflqX29zvesZW2xOQ-xsNqO47m55DA.ttf) format('truetype');
}
#membercounterwrapper {
width:100%;
font-size:34px;
font-family:jura;
text-align:center;
margin-top:50px;
}
#membercounterwrapper span {
font-size:34px;
font-family:jura;
vertical-align:middle;
}
.odometer.odometer-auto-theme, .odometer.odometer-theme-default {
display: inline-block;
vertical-align: middle;
*vertical-align: auto;
*zoom: 1;
*display: inline;
position: relative;
}
.odometer.odometer-auto-theme .odometer-digit, .odometer.odometer-theme-default .odometer-digit {
display: inline-block;
vertical-align: middle;
*vertical-align: auto;
*zoom: 1;
*display: inline;
position: relative;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer, .odometer.odometer-theme-default .odometer-digit .odometer-digit-spacer {
display: inline-block;
vertical-align: middle;
*vertical-align: auto;
*zoom: 1;
*display: inline;
visibility: hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, .odometer.odometer-theme-default .odometer-digit .odometer-digit-inner {
text-align: left;
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
overflow: hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon, .odometer.odometer-theme-default .odometer-digit .odometer-ribbon {
display: block;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner, .odometer.odometer-theme-default .odometer-digit .odometer-ribbon-inner {
display: block;
-webkit-backface-visibility: hidden;
}
.odometer.odometer-auto-theme .odometer-digit .odometer-value, .odometer.odometer-theme-default .odometer-digit .odometer-value {
display: block;
-webkit-transform:...
JavaScript
counter = new Odometer({
el: document.querySelector("#membercounterwrapper .odom"),
minIntegerLen: 6,
format: "(,ddd)",
theme: "default",
value: 100
});
console.log(counter);
setTimeout(function() {
counter.update(87);
}, 500);